stevejpurves
commented
1 month ago @zillionare if you are building a Vue app - I think you need to take an alternate route and not use the top level thebe library. Instead you should look at using thebe-core available on npmjs and found in packages/core, there is also apps/demo-core that might give you some insights on how that is used as will the thebe-react library, that is going to give you much more control over how thebe works in a complex app.
However, if you want to go this route you need to figure out why the DOMContentLoaded even handler is not getting hit https://github.com/jupyter-book/thebe/blob/2f69ba2bf42a3bde8bbd28de7359f355f3c8781b/packages/thebe/src/index.ts#L28 and either rememdy that or make the calls that that handler makes to read the page config then bootstrap thebe. But it sounds like setupThebeCore() and setupGlobals() are not getting called either, so you'd need to call those too. How are you adding the script tag, does vue execute the script on load?
zillionare
This is a fantastic project, and I really need it. However, I encountered some difficulties during configuration. First, I tested my configuration using plain HTML (with a local JupyterLab server) to confirm that the configuration is correct.
this is from test.html:
this is the configuration:
But when I tried to create a component in a Vue 3 project to load the code, it wouldn’t work no matter what I did. In the page generated by the component, checking the
section:they both runs on same host(static and vue3 project), with same base url to jupyter.
I can see the later one, there's no data-thebe-loaded property attached. And there's no thebe object under window namespace.
How should I troubleshoot this?