Enabling Capacitor

Capacitor is a powerful tool for shipping to native platforms like iOS and Android, separate from or alongside your web app.

The good news is that it's installed by default with @nuxtjs/ionic. You just need to enable it in your ionic app, and choose what platforms you want to support.

The Ionic CLI is available via npx or can be installed globally with npm install -g @ionic/cli or yarn global add @ionic/cli or pnpm add -g @ionic/cli.

npx
npx @ionic/cli integrations enable capacitornpx @ionic/cli capacitor add iosnpx @ionic/cli capacitor add android
npm
# ionic config set -g npmClient npmionic integrations enable capacitorionic capacitor add iosionic capacitor add android
yarn
ionic config set -g npmClient yarnionic integrations enable capacitorionic capacitor add iosionic capacitor add android
pnpm
ionic config set -g npmClient pnpmionic integrations enable capacitorionic capacitor add iosionic capacitor add android

Run on iOS or Android

Once an Android or iOS project is added with Capacitor, you can run your app on an iOS or Android emulator.

Android Studio and SDK (for Android projects) or XCode (for iOS projects) are required to use the npx cap open or npx cap run command. See the Capacitor Environment Setup docs for details.

To build, sync, and run your app:

  1. Create a web build with npx nuxi generate or npx nuxi build.
  2. Run npx cap sync to update your Capacitor project directories with your latest app build.
  3. Run npx cap run android or npx cap run ios to run the app from the command line using an installed device OR
  4. (Optional) Run npx cap open android or npx cap open ios to open the project in Android Studio or XCode, respectively.

Remember to run npx cap sync after every new build to ensure your Android and/or iOS project is up-to-date.