Capacitor Integration Bug

[cgrulke]

So I have been struggling to get any JS for Capacitor plugins to work. After two days of deep diving into the issue, I believe that the bundler that auto installed when you add a platform to a mobile app project has been deprecated.

“[warn] The bundledWebRuntime configuration option has been deprecated. Please, use a bundler to bundle Capacitor and its plugins.”

This has been causing both import and require within JS to throw an error in the dev console. Most of the Capacitor plugins need import or require to use.

Is this something that can be updated on Wappler’s end? Or is there a workaround to get my mobile app code bundled?

I have tried using Rollup and Webpack but can’t figure out what the entry file within the Wappler project is.

Here is the full output as soon as I add iOS to a mobile project.

If this is not a bug on Wappler’s end, can you guys please give me some guidance on how to get Capacitor plugins to work on mobile.

[jmartland22]

Have you seen https://youtu.be/DFvtXYCJzew?si=3S2g9TPlAiWl-eya . He talks through getting local notifications plugin working in capacitor and wappler. Is a year old though so it may not work now.

[cgrulke]

Thank you for sharing this resource. I’ll give it a try.

[cgrulke]

Just so it’s here for everyone. I figured out how to get things going with Webpack by following this.

Since whatever bundler either Wappler or Capacitor was using is now deprecated, you have to install another one like Webpack manually

https://medium.com/@SmileFX/a-complete-guide-building-a-capacitorjs-application-using-pure-javascript-and-webpack-37d00f11720d

The only thing I would add, is that after you add your platforms (iOS and Android), each time you need to go back into your package.json and switch your “@capacitor/core”: version back to 5.3.0 from 4.6.0 then run npm install in your terminal.

Wappler keeps reverting it to 4.6.0 every time you add a platform.

[Teodor]

Please make sure to update your Capacitor project to the latest version: Updating Capacitor Projects in Wappler 6

[Rubens_Bentes_da_Sil]

Did you delete everything and create a project from scratch or simply add Webpack? I was a little confused on how to proceed.

[cgrulke]

You should be able to install webpack without starting from scratch

[Rubens_Bentes_da_Sil]

And did you still need this modification even though you updated the capacitor as @Teodor indicated? For me it keeps giving me an error, I’m trying to use the Push Notification plugin in my project.

[Teodor]

This is now fixed in Wappler 6.0.3

[franse]

@Teodor

This is now fixed in Wappler 6.0.3

Can I kindly ask how this is fixed?

@cgrulke

I have been struggling to get any JS for Capacitor plugins to work

@cgrulke

This has been causing both import and require within JS to throw an error in the dev console. Most of the Capacitor plugins need import or require to use.

This stills happening.
The only workaround for this is Tutorial: Installing and using Capacitor and Cordova plugins

Are we supposed to see anything new related to Capacitor plugins?

[George]

Capacitor.js is now automatically copied and included. Also the two supported plugins like Capacitor SQLite and Capacitor camera are now auto updated.

More capacitor plugins as built-in extensions will follow soon.