Initial Setup
This page describes the initial setup steps. Follow the steps to get the app setup and running on your dev environment, as well as on your devices.
Last updated
This page describes the initial setup steps. Follow the steps to get the app setup and running on your dev environment, as well as on your devices.
Last updated
Here's a small video showing the setup and first run of the app on a Mac System. For details of setup process, follow the instructions in following sections
Ionic apps are created and developed primarily through the Ionic command-line utility. The Ionic CLI is the preferred method of installation, as it offers a wide range of dev tools and help options along the way.
Almost all tooling for modern JavaScript projects is based in Node.js. The download page has prebuilt installation packages for all platforms. We recommend selecting the LTS version to ensure best compatibility. (The base requirements for Capacitor are Node v8.6.0 or later, and NPM version 5.6.0 or later, but we recommend node 12.16.1-LTS)
Node is bundled with npm, the package manager for JavaScript.
To verify the installation, open a new terminal window and run:
This starter app will run best with node 12.16.1
Node and NPM version are constantly updated so if you face any issue in setup, or warnings in npm audit feel free to contact us.
Before proceeding, make sure a stable version of Node.js and npm are installed. Install the latest Ionic CLI globally with npm:
Git is a distributed version-control system for tracking changes in source code during software development. Although it's not required, we highly recommend using Git for your app development.
First, install the command-line utility from the download page. For a GUI client, we recommend SourceTree. To verify the installation, open a new terminal window and run:
You can also use Git CLI to perform all Git related tasks. A good description of all Git CLI commands is given here.
After you have Ionic installed, you have to install all the dependencies required by the app. These dependencies are listed in package.json file in the root of the project. To do this just run the following command using a terminal inside your ionic app folder path.
If you are using latest NPM, you might see an audit report after the installation is completed. If you see any vulnerability marked as high , please contact us regarding the same. (You can also always run npm audit fix to fix the vulnerable versions)
Personally we use VS Code , however, many people like Atom. You are free to choose any code editor you like.
For building iOS apps, Capacitor requires a Mac with Xcode 10 or above. Soon, you'll be able to use Ionic Appflow to build for iOS even if you're on Windows.
Additionally, you'll need to install CocoaPods (sudo gem install cocoapods), and install the Xcode Command Line tools (either from Xcode, or running xcode-select --install).
Once you have CocoaPods installed, update your local repo by running pod repo update. You should run this command periodically to ensure you have the latest versions of CocoaPods dependencies.
As a rule, the latest version of Capacitor always supports the last two iOS versions. For example, iOS 11 and iOS 12. For support for older versions of iOS, use an older version of Capacitor (if available).
Capacitor uses the WKWebView.
First, the Java 8 JDK must be installed and set to the default if you have other versions of the JDK installed. Java 9 does not work at the moment.
Android development requires the Android SDK installed with Android Studio. Technically, Android Studio isn't required as you can build and run apps using only the Android CLI tools, but it will make building and running your app much easier so we strongly recommend using it.
Android version support for Capacitor is more complex than iOS. Currently, we are targeting API level 21 or greater, meaning Android 5.0 (Lollipop) or above. As of May 2019, this represents over 89% of the Android market.
Also, Capacitor requires an Android WebView with Chrome version 50 or later. On Android 5 and 6, the Capacitor uses the System WebView. On Android 7+, Google Chrome is used.
Now we have everything installed, we can test our Ionic App.
Go to Running the App section to see how to do it.