Launching app code in a simulator like Xcode or Android Studio

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.