my-recommended-ionic-development-setup.md

This is my recommended setup for developing Ionic apps (Ionic 1 or Ionic 2). The tools and their versions that I use (as per November 6, 2016) are:

nvm v0.31.1
node v6.9.1
npm v3.10.8
ionic (CLI) v2.1.4
cordova v6.4.0
gulp v3.9.1
bower 1.8.0

These are up to date, but stable versions, and tested extensively in combination.

Intro

First of all, I strongly recommend using nvm because this allows you to install and try out different versions of nodejs on your system and to easily switch between them. Each nodejs installation managed by nvm will have its own npm packages installed, and all the installations are completely isolated from each other.

In case you run into problems, you can easily switch back to your "old" node installation which will be completely unharmed by the new version that you added. This makes it safe and easy to experiment with new node versions and npm packages.

For your reference, here are the versions I have installed and am using as per November 8, 2016 (these versions are tested with the ionic-quickstarter app):

Installing nvm

Installing nvm is explained here but is in essence done with the following one-liner:

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.32.1/install.sh | bash

Installing node and npm

Install node version 6.9.1 (6.9.0 or 6.9.2 will probably also work fine), as follows:

nvm install 6.9.1
nvm use 6.9.1

This will install node (v6.9.1) and also npm (v3.10.8). Verify that the correct versions are installed now by executing the commands: node -v and npm -v

To make sure that this node version is the default when you open a new terminal, add this line to your .bashrc file:

nvm alias default v6.9.1

Installing ionic, and cordova and other tools

Install the ionic CLI, cordova and the other tools by running the following commands. Note: instead of just npm you may want to type npm -d, this gives a lot more progress information on what is exactly happening (convenient especially when you have a slower network connection).

npm install -g ionic cordova ios-sim ios-deploy
npm install -g gulp
npm install -g bower

Check the installed versions by running ionic -v, cordova -v and so on. On my system, on November 6 2016, this resulted in: Ionic CLI v2.1.4, Cordova v6.4.0, Gulp v3.9.1, Bower v1.8.0.

If you want to develop Ionic 2 apps too (besides Ionic 1 apps), then it is a good idea to also install Typescript (see https://blog.ionic.io/ionic-and-typings/):

npm install -g typings
npm install -g typescript

(installing the typescript compiler globally is not strictly needed but may be convenient if you use an IDE which integrates with Typescript)

Install an Ionic app from a Github repo - example: ionic-quickstarter

Now that all the prerequisites have been installed, you are ready to install an Ionic app from Github, for instance:

git clone https://github.com/leob/ionic-quickstarter
mv ionic-quickstarter myapp
cd myapp
rm -rf .git
git init
# optionally customize ionic.config.json and config.xml:
vim ionic.config.json
vim config.xml
npm install
bower install
ionic state restore --plugins

Next, test your installation by running the app in a browser:

ionic serve -l -c --browser google-chrome

If you want to run the app on a device, then add the Android and/or iOS platforms:

ionic platform add android
ionic platform add ios

Note: the commands above install the newest Cordova platforms. In some cases you may run into issues with one or more Cordova plugins which cannot run with the newest platform versions. In that case you may revert to a lower version of the platforms, for me the following commands did the trick (android v5.1.1 and ios v4.1.1 worked with all of my plugins):

ionic platform rm android
ionic platform rm ios
cordova platform add android@5.1.1
cordova platform add ios@4.1.1

If you have an existing app which has "old" Cordova platforms that are incompatible with the newer Cordova (v6.4.0) which you have now installed, you may need to upgrade them to a newer version. This can be done either in the way explained above (ionic platform rm ... followed by cordova platform add ...), or through the following commands:

cordova platform update android
cordova platform update ios

or with a version number:

cordova platform update android@5.1.1
cordova platform update ios@4.1.1