Ionic開發環境搭建

Ionic開發環境搭建

1.安裝jdk

1.1.安裝【jdk-8u60-windows-x64.exe】到【C:\Program Files\】目錄

 

1.2.jdk下載地址

http://www.oracle.com/technetwork/java/javase/downloads/index-jsp-138363.html

或者百度一下jdk

2.安裝adt

2.1.解壓【adt-bundle-windows-x86_64-20140702.zip】到【D:\Program Files\】

 

2.2.adt下載地址

http://www.androiddevtools.cn/

3.安裝ant

3.1.解壓【apache-ant-1.9.6-bin.zip】到【D:\Program Files\】

 

3.2.ant下載地址

http://ant.apache.org/

4.配置環境變量

4.1.添加系統變量

添加如下系統變量

JAVA_HOME

C:\Program Files\Java\jdk1.8.0_60

 

ANDROID_HOME

D:\Program Files\adt-bundle-windows-x86_64-20140702\sdk

 

ANT_HOME

D:\Program Files\apache-ant-1.9.6

 

步驟請參考下圖

右鍵【個人電腦】——》【屬性】——》【高級系統設置】——》【環境變量】

 

【新建】——》輸入【變量名】和【變量值】——》【肯定】

PS：JAVA_HOME、ANDROID_HOME、ANT_HOME都要執行該步驟一次

 

添加完JAVA_HOME、ANDROID_HOME、ANT_HOME結果以下

 

4.2.修改PATH變量

%ANDROID_HOME%\platform-tools;

%ANDROID_HOME%\tools;

%JAVA_HOME%\bin;

%ANT_HOME%\bin;

 

將如下字符串追加到【Path】變量的變量值的最後面

【;%ANDROID_HOME%\platform-tools;%ANDROID_HOME%\tools;%JAVA_HOME%\bin;%ANT_HOME%\bin;】

 

【肯定】

 

5.安裝Node.js

5.1.下載地址

https://nodejs.org/

6.安裝ionic

6.1.安裝ionic cli

打開命令行，執行如下命令：

【npm install -g cordova ionic】

6.2.建立項目

打開命令行，依次執行如下命令：

【ionic start myApp tabs】

【cd myApp】

【ionic platform add android】

6.3.打包apk

打開命令行，執行如下命令：

【ionic build android】

提示打包成功後，能夠在如下目錄找到對應的apk:

【D:\Dev\Projects_Test\myApp\platforms\android\build\outputs\apk\】

7.打包報錯可能的緣由及其解決方案

7.1.目錄中包含中文字符

解決方案：將項目放到不含中文字符的目錄中，再打包

7.2.安裝了與操做系統不對應的jdk

例如，你原本是win10 64位操做系統，可是你安裝的是win7 32位的jdk

解決方案：刪除jdk，到官網下載與操做系統對應的jdk再安裝

7.3.持續更新中...