ionic1開發環境配置,常見問題解決方法

本文轉載自查看原文 2018-03-22 14:32 1029 ionic

本文從 Ionic1開發環境環境配置， 配置中遇到的問題 2個方面說明.

環境：windows7 32位+jdk1.8+ionic1.3，64位系統可以參考下面方法，軟件注意選擇對應的版本即可。

Ionic1開發環境環境配置 步驟如下：

1、下載JDK並配置Java運行環境

http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html

安裝后需要進行如下配置：

在“系統變量”中，設置3項屬性，JAVA_HOME,PATH,CLASSPATH(大小寫無所謂),若已存在則點擊“編輯”，不存在則點擊“新建”。

1）JAVA_HOME

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

注意：JAVA_HOME指明JDK安裝路徑，就是剛才安裝時所選擇的路徑，此路徑下包括lib，bin，jre等文件夾。

2）Path

%JAVA_HOME%\bin;

　　　　在系統變量Path的值的最前面加入.否則可能在運行時，系統選擇部署在前面的jre環境。

　　　　注意：Path使得系統可以在任何路徑下識別java命令

3）CLASSPATH

.;%JAVA_HOME%\lib

注意: 點好表示當前目錄，不能省略

CLASSPATH為java加載類(class or lib)路徑，只有類在classpath中，java命令才能識別

測試：“開始”－>“運行”，鍵入“cmd”，鍵入命令“java -version”，出現下圖畫面，說明環境變量配置成功。

2、下載Apache Ant 並將其bin目錄路徑添加進Path路徑

http://mirror.tcpdiag.net/apache/ant/binaries/

下載完成后解壓，如存放在C盤 Program Files目錄下則Path中添加如下值 C:\Program Files\apache-ant-1.9.4\bin;

並添加path環境變量（添加方法和java配置path變量是一樣的，注意以；隔開每個環境變量的值）

3、下載Android Studio

http://rj.baidu.com/soft/detail/27390.html?ald

1）由於下載Android SDK並非易事，需要配置代理或FQ；

2）在使用中會有各種報錯或提示更新sdk等亂七八糟問題，

因此推薦下載Android Studio （百度軟件中心下載速度不錯），下載后進行安裝，會提示選擇SDK安裝路徑，我們主要使用的就是這個SDK。(android studio 安裝完成后，如果找不到android-sdk,可以啟動android studio,會提示缺少android sdk 等組件，自動更新即可。)

能看到下面的圖，說明sdk及相關組件安裝完成，sdk路徑是：

C:\Users\Administrator\AppData\Local\Android\sdk

完成安裝后向系統Path環境變量中添加兩個值。分別是 Android SDK中tools目錄的路徑和platform-tools的路徑。例如：

C:\Users\Administrator\AppData\Local\Android\sdk\tools;

C:\Users\Administrator\AppData\Local\Android\sdk\platform-tools;

4、下載NodeJs並安裝

https://nodejs.org/download/

5、安裝Ionic 和 Cordova

http://ionicframework.com/getting-started/

運行“CMD” 鍵入“npm install -g cordova ionic” 根據網絡環境，安裝的時間有所不同。

安裝完成后，就可以創建一個Ionic項目“ionic start myApp tabs”

進入myApp項目 “cd myApp”

在瀏覽器中運行 "ionic serve"

添加安裝平台 “ionic platform add android”

編譯成apk “ionic build android”

直接在手機上進行調試“ionic run”

補充說明： npm鏡像使用，按裝ionic指定版本

1. 安裝cordova: npm 站點上的資源國內訪問較慢，我們再使用npm 安裝文件的時候，使用了淘寶鏡像 http://npm.taobao.org/ .來安裝。命令有所改變，把npm，換成cnpm,其他不變。

eg:cnpm install [name]

2.安裝ionic: 我們ionic 用的是 ionic 1.3版本，而默認使用 npm install -g ionic 會安裝最新的版本。

所以如果要按照制定版本的ionic ,則可以使用如下命令。

eg:npm install -g ionic@1.3 其中1.3是版本號這是npm原始命令。

我們使用是淘寶的鏡像，命令應該是:

npm install -g ionic@1.3

看到這個畫面，說明ionic 1.3 已經安裝成功。

3.創建ionic 項目，以安卓平台為例。

1.進入存放項目的文件夾，假設項目放在www目錄

打開DOS 窗口，進入www 文件夾

2.在這個文件夾（www）下面創建一個ionic項目，名字是 ionic_app，tabs 是默認的選項卡模板，空白的可以是 blank.

ionic start ionic_app tabs

看到下面的圖，說明項目創建成功。

3.預覽項目（瀏覽器預覽項目）：

會自動打開默認瀏覽器：

4.ionic 添加平台，在手機上調試，編譯命令如下：

進入項目所在目錄，執行如下命令：

1.添加安裝平台 “ionic platform add android” //添加安卓平台

能看到這里，說明成功。

項目目錄會生成一個文件夾：

2.編譯成apk “ionic build android”

ionic1配置環境中，可能遇到的問題，整理如下：

1.編譯時，gradle無法下載,或下載慢的解決方法：

gradle 下載： https://services.gradle.org/distributions/

2.vm 初始化，檢查環境變量配置是否正確，查看：1、下載JDK並配置Java運行環境配置這里。

3.提示類似如下錯誤，大致意思是內存空間不足，使用下文中介紹的第2種方法解決了問題

ionic Could not reserve enough space for 2097152KB object heap

4.android sdk 對應的api 沒有，顯示用的是25,而自己的api總沒有，顯示沒有授權。

[android SDK Platform 25].

Before building your project, you need to accept the license agreements and comp lete the installation of the missing components using the Android Studio SDK Man ager

解決方法：再 android studio 中，打開sdk manager,下載25版本。

5.出現假死：

大致如下：

mergeDebugResourcesException in thread "png-cruncher_5" jav on: Timed out while waiting for slave aapt process, make su t C:\Users\Administrator\AppData\Local\Android\sdk\build-to an run successfully (some anti-virus may block it) or try s riable SLAVE_AAPT_TIMEOUT to a value bigger than 5 seconds