Loading the code in a platform - in this article, I'll be focusing on Android and iOS. Ionic app shell prompts for iOS and Android devices.
iOS
npm run build
npx cap sync
npx cap copy ios
npx cap open ios
Android
npm run build
npx cap sync
npx cap copy android
npx cap open android
Chained commands
iOS
npm run build && npx cap sync && npx cap copy ios && npx cap open ios
Android
npm run build && npx cap sync && npx cap copy android && npx cap open android
If doing both, best to separate them into two primary zones
Set up for either Android or iOS
npm run build && npx cap sync
Then add the corresponding platform
iOS
npx cap copy ios && npx cap open ios
Android
npx cap copy android && npx cap open android
Breaking down the steps
npm run build
This command will do custom work written inside package.json. It lets you perform any necessary building/prep tasks for your project.
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
npx cap sync
This command runs npx cap copy and npx cap update. This action will copy all the change to {platform}/app/src/main/assets/public, ensure the android and ios platform have the same conditions.
npx cap copy
This command copies what's in your webDir to the native platforms like Android and iOS. If you have Cordova files they will also be copied.
npx cap update
Searches for Cordova and Capacitor plugins and copy/update some native files the plugins need for working.
So copy is for "web" files and update for "native" files and sync does both.
npx cap open iOS / android
Open's the project in the native software such as Xcode / Android Studio.