Capacitor alongside web



  • I’m building an android app with capacitor and quasar. In my devflow I like to use the browser and not the phone emulator.

    I’m using the notification plugin from @capacitor/core and all works fine for quasar dev -m capacitor but when I just want to develop in the browser it cannot load the dependency since it is located in /src-capacitor

    I tried

    if (this.$q.platform.is.capacitor) require('/my/capacitor-dependent-service.js')
    

    but with no luck.

    It is solved by duplicating the package into /src as well of course but is there any cleaner way?



  • I launch the app on a physical phone and I use remote devtools on chrome, you get almost the same environment. (but I don’t have the vue devtools available).



  • I have the same problem, you can’t even access the default plugins that come with capacitor from the src / pages / index.vue views since the plugins are in src-capacitor / node_modules: in the capacitor api examples clearly shows that import {Plugins} from “@ capacitor / core” but this is not possible for the above mentioned. How can capacitor resources be used from src if Qusar creates a subfolder src-capacitor ??



  • testing and testing I solved them:
    it seems to me that the problem is yarn since
    capacitor also uses npx. If you use capacitor mode always use npm as package getor
    also after adding quasar add mode capacitor: go to the src-capacitor folder and do npx cap add android.

    then try:
    in pages / Index.vue
    import {Plugins} from “@ capacitor / core”
    console.log (Plugins). and I already got results.



  • @jpolstrre
    Cool that it worked for you, thanks for sharing!

    For me I’m already using npm pretty much everywhere and the android platform was already added so for me I’m still out of luck. I guess I just use the dev -m capacitor command and use the external IP it returns in the browser. Shame though since I really wanted to run it on localhost.




Log in to reply