Explains all the steps required to deploy an Ionic 4 App to Android Simulator using Cordova.

Deploy Ionic App To Android Simulator
Deploy Ionic App To Android Simulator
March 10, 2019

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.

Prepare For Android Native

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.

Hello Ionic On Simulator

Fig 2

This is how we can run the application using Ionic 4, Cordova and Android Simulator.

Write a Comment

Click on the captcha image to get new code.
Discussion Forum by DISQUS