Migrate Your HTML5 Game to Cordova

Now that Apache Cordova is installed, you are ready to migrate your HTML5 game to Cordova.

Create a Cordova Project

Open the Terminal (or other shell), and change to a directory that you want to work in. Next, run Cordova's create command to create a Cordova project. For example:

cordova create hello com.example.hello HelloWorld

Refer to the documentation for more information.

Transfer Your Game’s Files

Replace the index.html file below with your game’s main HTML file. If it has another name besides index.html, you’ll need to change <content src="" /> element inside config.xml.

Bear in mind that index.html needs to load the index.js script:

<script src="js/index.js"></script>

Move over your css and javascript files to the respective folders.

Verify that your game still works in a browser before proceeding to the next step.

Add relevant platforms

Platform prerequisites

Before installing a platform (Android or iOS), make sure it has its prerequisites so that you can build and test your app on it. Refer to the official documentation for more information.

Add desired platforms

Open the Terminal (or other shell) app, change to your app's directory and run:

cordova platform add iOS
cordova platform add android

An Xcode project will be created in <app-root>/platforms/ios if you specified iOS, and an Android Studio project will be created in <app-root>/platforms/android for Android.

Install the Device Plugin

Now, install the device plugin. From Terminal, run:

cordova plugin add cordova-plugin-device

followed by:

cordova plugin save

Compiling and Testing

You can compile and test your game in a number of ways. First, you can compile and run your app directly from Xcode (for iOS) or Android Studio (for Android). Second, Cordova provides platform specific scripts to compile and run your app without using the Cordova CLI. Refer to the documentation for iOS and Android.