Ionic 介紹
首先,Ionic 是什么。
Ionic 是一款基於 Cordova 及 Angular 開發 Hybrid/Web APP 的前端框架,類似的其他框架有:Intel XDK等。
簡單來說就是可以將你的 Web 應用打包發布成 IOS/Android APP,並且提供了 Cordova 之外很多強大的服務和新的特性。
聽起來還是很誘人的,事實上這也是目前最火的一種 Hybrid APP 開發方式。
接下來介紹如何在 Windows 下搭建 Ionic 開發環境。
在開始之前我假設你已經了解了如下概念:
- Java JDK
- Apache Ant
- Android SDK
- NodeJS
以上名詞這里就不贅述,如果有不清楚的可以自行查閱
安裝步驟
Ionic 官方教程:http://learn.ionicframework.com/videos/windows-android/
以下內容參考官方教程得出:
下載 JDK 並配置好 Java 運行環境
下載地址:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html(請注意選擇您電腦的對應版本)
Java 環境變量的配置:參看:http://zhidao.baidu.com/question/1366931535221381339.html
下載 Apache Ant 並將其 bin 目錄路徑添加進 Path 路徑
下載地址:http://mirror.tcpdiag.net/apache//ant/binaries/apache-ant-1.9.4-bin.zip
下載完成后解壓該文件至某個安全的目錄下,然后將改文件夾內的bin文件夾路徑添加至系統 Path 環境變量中,如存放在 C 盤 Program Files 目錄下則 Path 中添加如下值 C:\Program Files\apache-ant-1.9.4\bin;(添加方法和 java 配置 path 變量是一樣的,注意以;隔開每個環境變量的值)
下載 Android SDK 並配置好 SDK 運行環境
下載地址:http://developer.android.com/sdk/index.html
這里可以只下載 Android SDK 不需要一並下載 Android Studio。
下載完成並安裝然后向系統Path環境變量中添加兩個值。分別是 Android SDK 中 tools 目錄的路徑和 platform-tools 的路徑。例如:
- C:\Program Files (x86)\Android\android-sdk\tools;
- C:\Program Files (x86)\Android\android-sdk\platform-tools;
在這里我發現 Android SDK 安裝目錄中並沒有platform-tools這個文件夾,運行 tools 目錄下的 android.bat 文件,然后在出現的界面中勾選 Android SDK Platform-tools 然后安裝。
注意:這里我下載的純凈版 SDK 之前並沒有任何 Android 系統在內,所以同 Platform-tools 一樣需要在這里勾選需要的版本然后安裝。這里至少需要有一個系統,否則無法創建虛擬機。當然,用真機調試的話可以不依賴。
配置 Gradle
下載地址:http://services.gradle.org/distributions/
下載相應版本的 gradle(對應 cordova-android),然后解壓放置在某個目錄下,然后向系統 Path 環境變量中添加:
- D:\Program Files\gradle\gradle-3.3\bin
下載 Nodejs for Windows 並安裝
下載地址:https://nodejs.org/download/
Windows 下安裝 Nodejs 環境很簡單,在 Nodejs 官網下載正確版本后安裝即可。
nmp 安裝 Ionic 和 Cordova
完成以上幾步需要配置的環境就搭建完成了,接下來就只需要在控制台輸入簡單的幾行命令就可以安裝 Ionic 和 Cordova 啦。
進入 cmd 窗口,輸入如下指令:
npm install -g cordova ionic
完成以上所有步驟,就可以開始利用 Ionic 快速開發 Android APP 啦
創建並運行 ionic app
創建 APP
進入 cmd 窗口,輸入如下指令:
ionic start myapp
這里的 myapp 是你的 APP 的名字
進入創建的 APP 目錄
cd myapp
選擇配置 Android 環境
ionic platform add android
打包生成 APP
ionic build android
運行 APP
需要先新建虛擬機或者連接手機。
- 新建虛擬機:打開 Android SDK 安裝目錄下的 AVD Manager.exe 選擇新建
- 連接手機:直接通過數據線連接真實設備
ionic run android
到這一步系統就會打開虛擬機或者在真實設備運行簡單的示例 APP 了。
其它
--prod 的作用
在編譯命令的最后加上 --prod 會讓 app 的啟動速度加快,但構建速度會變慢。
ionic build android --release --prod
無論是 debug 版本還是 release 版本都適用。
APP 簽名
生成簽名文件
生成簽名文件需要用到 keytool.exe (位於 jdk1.6.0_24\jre\bin 目錄下),使用產生的 key 對 apk 簽名用到的是 jarsigner.exe (位於 jdk1.6.0_24\bin 目錄下),把上兩個軟件所在的目錄添加到環境變量path后,即可使用生成簽名文件的命令:
keytool -genkey -v -keystore demo.jks -alias demo -keyalg RSA -keysize 2048 -validity 10000
-
-genkey:產生密鑰
-
-keystore: 簽名文件名稱(這里是
demo.jks,demo可以自定義,jks是 Android studio 生成的簽名文件的后綴) -
-alias:簽名文件的別名(這里是
demo,可自定義) -
-keyalg:使用 RSA 算法對簽名加密(默認 RSA )
-
-validity 有效期限(這里是 10000 天,可自定義)
以上命令在 cmd 運行如下:

自動簽名
在工程目錄 /platforms/android 目錄新建名為 release-signing.properties 的文件,文件內容如下:
storeFile=demo.jks
keyAlias=demo
storePassword=輸入的密鑰庫口令
keyPassword=輸入的密鑰口令
這樣,使用 ionic build android --release 編譯即可,在 /platforms/android/build/outputs/apk 下就會生成已簽名的安裝包 android-release.apk
在 windows 下 storeFile 文件路徑應使用 Unix 下的目錄分隔符 / 。
了解更多可進入 Ionic 官網: http://ionicframework.com/ 進行拓展閱讀。
