I’m developing an app using a little bit of plain Javascript with a Go app compiled to WASM. Things are working well so far. But I want to use some plugins, starting with the status bar plugin. I understand the example code, at https://capacitorjs.com/docs/apis/status-bar, is Typescript (which I don’t know). Is there a step by step run through of how to compile it down to plain javascript, for someone who is not immersed in the various Javascript/Typescript/etc worlds and is not using a framework? Like, I’m not even using a node-based build process.
The example code is just plain javascript, so you may need to elaborate more on what parts you’re not following.
Check out the web/pwa details here for using Capacitor without a build system.
Thanks for your responses, and again, please pardon my javascript newbie-ness. I took the status bar example code, put it in a file statusbar.js, and include it in my index.html thusly:
<script type="module" src="/js/statusbar.js"></script>
That causes an error because of the import statement:
(index):1 Uncaught TypeError: Failed to resolve module specifier "@capacitor/core". Relative references must start with either "/", "./", or "../".
I understand that relative imports are re-written by webpack, but I’m not using that. Is there an easy way to convert that to something that resolves correctly?
If you don’t want to use a bundler/framework, you can set "bundledWebRuntime": true in capacitor.config.json . That generates a capacitor.js file you can link in your app’s index.html.
That way you can use Capacitor object directly, which includes a Plugins object that contains all plugins.
So you can use the plugins like Capacitor.Plugins.StatusBar.hide();
2 Likes
Thank you. This was just what I needed!
How could one add capacitor plugins this way (using Capacitor object directly) in version 3 , since they are not included in capacitor.js?