DEV Community

Steve Mak
Steve Mak

Posted on

Ionic

Quick Start

For full documentation, please visit to the official website:

CLI

https://ionicframework.com/docs/cli/

Capacitor

https://capacitor.ionicframework.com/docs/

Native

https://ionicframework.com/docs/native

CLI

Install/Update Ionic as global CLI

npm install -g ionic
Enter fullscreen mode Exit fullscreen mode

New project

ionic start myApp
Enter fullscreen mode Exit fullscreen mode

Link project to Ionic AppFlow

ionic link
Enter fullscreen mode Exit fullscreen mode

Preview in web browser

ionic serve
Enter fullscreen mode Exit fullscreen mode

Build web assets and prepare your app for any platform targets

ionic build
Enter fullscreen mode Exit fullscreen mode

Add a native platform to your Ionic project

ionic capacitor add android
ionic capacitor add ios
Enter fullscreen mode Exit fullscreen mode

Open the project in Xcode

ionic capacitor open ios
Enter fullscreen mode Exit fullscreen mode

Sync web assets folder to ios/android folder

ionic capacitor copy ios
ionic capacitor copy android
Enter fullscreen mode Exit fullscreen mode

Live reload with capacitor

ionic capacitor run ios -l --external
ionic capacitor run android -l
Enter fullscreen mode Exit fullscreen mode

Install native plugin

// Install Core library (once per project)
npm install @ionic-native/core --save

// Install Ionic Native TypeScript wrapper
npm install @ionic-native/barcode-scanner --save

// Install Cordova plugin
npm install phonegap-plugin-barcodescanner --save

// Update native platform project(s) to include newly added plugin
ionic cap sync
Enter fullscreen mode Exit fullscreen mode

Image of Docusign

🛠️ Bring your solution into Docusign. Reach over 1.6M customers.

Docusign is now extensible. Overcome challenges with disconnected products and inaccessible data by bringing your solutions into Docusign and publishing to 1.6M customers in the App Center.

Learn more

Top comments (0)

AWS Security LIVE!

Tune in for AWS Security LIVE!

Join AWS Security LIVE! for expert insights and actionable tips to protect your organization and keep security teams prepared.

Learn More

👋 Kindness is contagious

Discover a treasure trove of wisdom within this insightful piece, highly respected in the nurturing DEV Community enviroment. Developers, whether novice or expert, are encouraged to participate and add to our shared knowledge basin.

A simple "thank you" can illuminate someone's day. Express your appreciation in the comments section!

On DEV, sharing ideas smoothens our journey and strengthens our community ties. Learn something useful? Offering a quick thanks to the author is deeply appreciated.

Okay