This tutorial explains the steps required to deploy an Ionic 4 App to Android Simulator using Cordova. The steps should be similar for other versions of Ionic.
We will be using the Hello World application developed in the previous tutorial for demonstration purpose. You can also follow this tutorial to install Android SDK Tools and create the Simulator without using Android Studio.
Configure Native Project
Install Cordova globally if not done yet. Execute the below-mentioned command.
npm i -g cordova
Make sure that the JAVA_HOME environment variable is set and it points to the right directory of Java bin. The below-mentioned steps also expect that a valid environment variable exist having the name set to ANDROID_HOME and the value must point to the root directory of Android SDK installed on the system.
The very first step involves the configuration of the native project using Cordova for Android as shown below.
ionic cordova prepare android
We must be in Ionic project directory i.e. the hello app directory else, Ionic will throw an error saying Sorry! ionic Cordova prepare can only be run in an Ionic project directory.
Ionic will ask to install the Android Platform for the first time. Choose Y and hit enter in such a case. The native installation results should be similar to the one shown in Fig 1.
Configure Package Name
We have to provide unique Bundle Id also called as Package Id to uniquely identify the application in Play Store. It's usually reverse domain name in the case where a website is associated with the application.
Open the file hello\platforms\android\app\src\main\res\xml\config.xml and update the id with the Package Id. Replace the id io.ionic.starter with your Package Id.
Also, update the same id in the application root file hello\config.xml replacing the auto-generated id io.ionic.starter.
Build the Application
Build the app to check for any errors before running the application. This step is optional since the run command will also build the application. Use the build command as shown below.
// Build the application
ionic cordova build android
// Build with detailed logs
ionic cordova build android --verbose
Run the Application
Run the application using the run command as shown below. Use the option verbose to see details logs. Make sure that only one version of Java is on system classpath, else Cordova will complain about it and throws an error.
// Run the application
ionic cordova run android -l
// Run with detailed logs
ionic cordova run android -l --verbose
The final output of the Hello Ionic application is as shown in Fig 2.
This is how we can run the application using Ionic 4, Cordova and Android Simulator.