Ionic+Cordova WebApp Android打包及環境搭建

寫一下這兩天打包app的總結，但願幫人省下一些搜索的時間。

一.準備工做：

須要安裝：
Nodejs、AndroidSDK、Apache-ant、Jdk，
Ionic、Cordova。

我這裏用到的版本

Nodejs：node-v6.3.1-x86.msi
Apache-ant：apache-ant-1.9.4
JDK：jdk-8u101-windows-i586.exe

二.環境配置：

1.Jdk環境配置

1.安裝
下載地址（注意根據本身所需選擇32位&64位）
http://www.oracle.com/technet...

2.配置環境

右鍵計算機——高級系統設置——高級——環境變量，如圖：

選擇【新建系統變量】--彈出「新建系統變量」對話框，在「變量名」文本框輸入JAVA_HOME,在「變量值」文本框輸入JDK的安裝路徑，單擊「肯定」按鈕，如圖：

在「系統變量」選項區域中查看PATH變量，若是不存在，則新建變量 PATH，不然選中該變量，單擊「編輯」按鈕，在「變量值」文本框的起始位置添加「%JAVA_HOME%bin;%JAVA_HOME%jrebin; ，單擊肯定按鈕，如圖：

CLASSPATH 環境變量放在最後面，是由於之後出現的莫名其妙的怪問題80%以上均可能是因爲CLASSPATH設置不對引發的，因此要加倍當心才行。CLASSPATH=.;%JAVA_HOME%libdt.jar;%JAVA_HOME%libtool.jar。要注意的是最前面的".;" 如圖：

3.至此Jdk環境配置完成

打開cmd，輸入java -version，返回java版本號即爲配置成功

2.NodeJs環境配置

1.下載地址

https://nodejs.org/en/download/

2.配置環境

[新版本都不須要設計環境變量了，軟件會自動寫入環境變量]

3.測試

打開cmd，輸入node -v，返回node版本號即爲安裝成功。

3.AndroidSDK環境配置

1.下載地址

https://developer.android.com...

2.配置環境

和JAVA相似，在環境變量中找到Path選中，點擊下面的【編輯】， 在變量值里加入androidSDK中tools和platform-tools的目錄路徑，這裏個人是D:android-sdktools;D:android-sdkplatform-tools;固然兩個之間要加個分號「;」。

Path = D:android-sdktools;D:android-sdkplatform-tools;

3.測試

打開cmd，輸入adb，不報錯即爲成功。

4.Apache-ant環境配置

1.下載地址

http://ant.apache.org/bindown...

2.配置環境

和JAVA環境配置步驟基本同樣，

ANT_HOME D:SWEapache-ant-1.8.4
CLASSPATH ;%ANT_HOME%lib;
PATH ;%ANT_HOME%bin;

3.測試

打開cmd，輸入ant -version，返回版本號即爲成功。

5.Ionic和Cordova的安裝

1.下載及安裝

打開cmd，若是以前裝過，建議先運行一次

npm uninstall -g ionic

再執行

npm install -g ionic cordova

2.測試

輸入ionic -v和cordova -v，分別返回ionic和cordova版本號即爲安裝成功

三.打包

小Tip：新版本的ionic和cordova加入了telemetry，若是你也遇到這樣的錯誤

You have been opted out of telemetry. To change this, run: cordova telemetry on.

能夠試試下面的方法解決

Commands to resolve or disable this, using CLI

• cordova/ionic telemetry on

• cordova/ionic telemetry off

• cordova/ionic build --no-telemetry

---

1.進入你要建立項目的路徑：

cd E:\Study\Android\ionic\Project

2.建立一個名爲myApp的還有tabs的項目（ionic start <project-name> <optional-template>） 可選模板爲sidemenu 側滑、tabs 底部tab切換、blank 空白）

ionic start myApp tabs

3.myApp就爲項目名稱,進入myApp這個文件夾:

cd myApp

4.把項目複製到這個文件夾後， 添加android平臺:

ionic platform add android

5.ionic會將本地的資源文件（支持png、psd和ai，尺寸越大越好）上傳到它的服務器進行處理。
本地資源文件放到resources目錄下，若是是某個平臺單獨的資源，能夠放到對應平臺下，好比resources/Android/icon.png。
這樣就會把處理好的資源自動放到該平臺下，而不是全部平臺都放。

ionic resources [--splash] [--icon]

把圖標等文件用該命令上傳本身的項目到ionic服務器，上傳完成後會有一個項目編號。把res文件夾下的文件替換到 platforms/android/res下，把簽名文件複製到 platforms/android/ 下

6.生成androidapk:

ionic build android

即生成apk，文件保存在platforms/android/build/outputs/apk下