搭建 AngularJS+Ionic+Cordova 開發環境并運行一個demo

目前的手機APP有三類：原生APP，WebAPP，HybridApp；HybridApp結合了前兩類APP各自的優點，越來越流行。

Cordova就是一個中間件，讓我們把WebAPP打包成HybridAPP，并且它提供了非常多的插件，方便我們使用原生APP的功能。

Ionic是一個界面樣式庫，仿照原生的ios和android界面；同時它是基于 AngularJs 的。

本文我們在win7中搭建 AngularJS+Ionic+Cordova 開發環境，包括所涉及的Node.js、Cordova CLI、JDK及Android SDK等。

</div>

關于Android開發環境的搭建，以及Cordova的下載使用，我們上一篇已經說明： 《Cordova環境搭建 & HelloWorld》

這一篇，我們來使用 AngularJS+Ionic+Cordova 快速地做出我們第一個HybridAPP，開始吧！

開始步驟網站上有： http://ionicframework.com/getting-started/

官網css組件： http://ionicframework.com/docs/components/#header

1 安裝Ionic和Cordova

官網 http://ionicframework.com/

國內 http://www.ionic.wang/

命令行安裝ionic

$ npm install -g cordova ionic

2 新建一個Ionic項目

$ ionic start myApp tabs

3 運行我們剛才創建的Ionic項目

$ cd myApp
$ ionic platform add android
$ ionic build android
$ ionic emulate android

4 在瀏覽器預覽并實時刷新

$ ionic serve

我們選擇localhost，并把瀏覽器調成mobile模式；

然后我們進入編輯器修改項目文件夾www中的代碼，看到，瀏覽器已經可以跟著我們的保存實時刷新，非常好用！！！