Installing Phonegap on Linux

Installing Phonegap on Linux

Introduction

Phonegap will enable you to write mobile apps in HTML/CSS/JavaScript and then deploy to multiple mobile targets including Android and iOS. This document will outline the installation procedure for Linux Mint. I did this on Linux Mint 16 but the process should be similar or the same for other versions too. Also, since Linux Mint is based upon Ubuntu, which in turn is based upon Debian, this may work (or help) on those distros and derivatives as well. For other flavours of Linux you should consult the relevant documentation as the overall process will be similar but the commands for installing programs will be different (e.g. rpm, aptitude and yum as opposed to apt-get). 

You can get this installed on Windows as well, but I found the emulator to run very slowly, even with the HAXM hardware virtualisation.

Install Pre-requisites

There’s a lot, I found this wasn’t all documented in the same place and I had to Google error messages, etc. to find solutions.

Install Apache Ant

A Java library and build tool required by Phonegap.

$ sudo apt-get install ant

Install Java Development SDK (JDK)

The Java Development Kit.

$ sudo apt-get install openjdk-7-jdk
This may change to openjdk-8-jdk in later Linux editions, Linux Mint 18 uses this number.

Install Android SDK

Go to https://developer.android.com/sdk/index.html?hl=sk

Download package relevant to your system. Unzip the file into your home folder, e.g. /home/username/android-sdk-linux

Set up environment

Edit your .bashrc file:

$ gedit ~/.bashrc

Add the lines to point variables at the installed apps, e.g.

JAVA_HOME=/usr/lib/jvm/default-java
ANDROID_HOME=$HOME/android-sdk-linux

PATH=$PATH:$JAVA_HOME/bin:$ANDROID_HOME/tools

You may need to add your bin folder to the path as well, it may already be there, if not then add “:$HOME/bin” to the path, e.g.

if [ -d “$HOME/bin” ] ; then
    PATH=$HOME/bin :$PATH
fi

Update Android SDKs

Open terminal and run the android sdk manager:

$ android &

Select packages if required, what you need should already be selected apart from “Intel x86 Atom System Image” (this will work better than emulating an ARM chip later), you may want install earlier versions also. Click the [Install (n) Packages] button. This may take a while, you’ll probably have time to grow some coffee beans, let alone make a cup. Luckily, as this is a multitasking operating system, you can go onto the next step whilst this one is completing. Once complete you may find there are still some packages to install, click on the [Install (n) Packages] button again.

Back in the terminal, if you didn’t start android in the background (& parameter)  then there’ll be no prompt, in this case press Ctrl+Z to pause android then enter the command bg:

$ bg

This will allow android to run in the background.

 

Install npm:

Node Packaged Modules

$ sudo apt-get install npm

Install Phonegap

$ sudo npm install -g phonegap

Install NodeJS

$ sudo apt-get install nodejs

Install ia32 libs

$ sudo apt-get install ia32-libs

Install adb

$ sudo apt-get install android-tools-adb

Fool OS into thinking nodejs is node

There are two packages in the Ubuntu repository that go by the name node, node is an amateur packet radio program and nodejs is an event based server side JavaScript engine. Unfortunately most nodejs programs will expect to use a binary called “node” so we link that back to nodejs, thus:

$ sudo ln -s /usr/bin/nodejs /usr/local/bin/node

As an aside, it’s probably better to not try this development on a PC where the amateur packet radio program “node” is installed or required since you may run into some compatibility issues.

Install hardware virtualisation helpers.

Emulating an android device without hardware virtualisation will be a slow and painful experience

$ sudo apt-get install qemu kvm

Create an AVD

Create an AVD (Android Virtual Device) to test the apps on, to do this go back to the Android SDK Manager (hopefully it will finish downloading/installing before you use it) go to Tools -> Manage AVDs. Add a new one

• Click the [New…] button. Give it a name, e.g. “nexus”
• Select device (e.g. Nexus 7).
• Select target (API Level, your choice).
• Select CPU (Intel Atom will work best with hardware virtualisation, you can select ARM if you want but it will be slower, much slower)
• Select a skin, your preference.
• Optionally select camera(s). Mine crashed when I tried to use it but you may get lucky, you can select Emulated as the camera, it will work but the pictures won’t actually be real.
• Optionally change memory options from defaults, you will need to enter a number in the SD Card if you want to use the camera.
• Optionally tick [Use Host GPU], this may help the graphics redraw rate if you have a decently powered GPU, I’ve not really noticed a difference yet.
• Press OK to save.

Don’t start the AVD yet otherwise it will start in emulation mode and be quite slow. If you don’t have a bin directory in your home directory then create one, the next time bash starts, it will add it to your path if it exists. Create a script file to start the AVD :

$ gedit ~/bin/nexus

Enter the following text:

#!/bin/sh
echo Starting Nexus…
emulator –avd nexus –qemu –enable-kvm &

Save and exit gedit, make the file executable:

$ chmod +x ~/bin/nexus

You can also get a bit more elaborate and have that script start any AVD you want, e.g.

#!/bin/bash
if [ "$1" == "" ]; then
    avd=nexus
    echo No parameter specified, defaulting to $avd

else
    avd=$1
fi
echo Starting android avd $avd
emulator -avd $avd -qemu -enable-kvm &

This script will fail if you have set the chosen AVD to have an ARM chip but you can also start the AVD from the Android Virtual Device Manager, although bear in mind that when you do this, the manager will not want to exit until the emulator is closed.

By now, you should have an Android emulator up and running

With that, you should be good to go, swipe to unlock the android device and create a phonegap app:

$ phonegap create myApp

$ cd myApp

$ phonegap run android

Addendum (28th Feb 2016):
With recent updates to phonegap, you may receive an error message saying it cannot find the module "bplist-parser", you can remedy this by installing it with the following command:

$ npm install -g bplist-parser