使用ionic3快速開發webapp（一）

Ionic可讓咱們使用web技術快速構建接近原生體驗的跨平臺移動應用。

1、安裝ionic

一、須要先安裝 Node.js（版本8.x之上）；

二、安裝cordova 和 ionic：

$ npm install -g cordova ionic

2、建立一個ionic應用（可使用Ionic官方提供的應用程序模板）：

$ ionic start ionApp tabs

生成的代碼目錄以下：

一、node-modules下是咱們引用的一些依賴模塊（eg：angular、cordova的相關模塊）；

二、platforms下是咱們的app要運行的平臺；

 　 eg：若是咱們的應用要運行在android平臺，能夠經過如下指令將android添加到platforms

$ ionic cordova platform add android

經過如下指令能夠將android從platforms移除

$ ionic cordova platform remove android

三、plugins下是咱們用到的插件；

　  查看項目安裝的插件：

 $ ionic cordova plugin list 

　  添加插件

$ ionic cordova plugin add pluginname 

　  刪除插件

$ ionic cordova plugin remove pluginname

 四、resources下是一些基礎資源；

 五、src下就是咱們的主要代碼目錄：

app下是主入口模塊，assets下是資源文件，index.html是咱們的主頁面，pages下是咱們添加的頁面，每一個頁面包括如下內容（html、scss、ts文件）：

六、www是咱們的源代碼編譯生成的，能夠直接在瀏覽器運行。

3、運行咱們的Ionic應用

$ cd ionApp
$ ionic serve

4、打包成混合app項目（以android爲例）：

$ ionic build
$ ionic cordova platform add android
$ ionic cordova run android

 打包以前須要先安裝：

一、JDK

二、SDK（androiddevtools），須要配置環境變量

三、gradle（gradle），須要配置環境變量

打包成功後會提示咱們所在路徑：