近期剛接觸到移動(dòng)端webApp的開發(fā)，入門需要配置ionic&cordova的基礎(chǔ)環(huán)境。翻閱眾多的技術(shù)帖之后總結(jié)出一套便于入門小白輕松配置開發(fā)環(huán)境的方法。
如下：

• 安裝node最新版本 獲取nodejs
• 安裝jdk 獲取jdk1.8x 提取碼：cu5g
• 安裝sdk 獲取sdk
• 安裝Apache Ant 獲取ant1.10.5 提取碼：6sit
• 安裝gradle-4.10 獲取grandle-4.10（打包app的時(shí)候出錯(cuò)，提示需要gradle-4.10的支持）
• node 安裝icnio和cordova
• 構(gòu)建自己的webApp 進(jìn)行測試

詳細(xì)步驟

1. jdk1.8x 安裝及環(huán)境變量配置
   • 安裝jdk 1.8x

     可以記住安裝的路徑，避免安裝之后配置環(huán)境的時(shí)候找不到文件路徑。1.8x版本可支持Apache Ant 的最新版本1.10.5 ，jdk1.7x并不支持

   • 配置
     • 右鍵桌面圖標(biāo)此電腦->選擇屬性->高級(jí)系統(tǒng)設(shè)置->環(huán)境變量。 避免麻煩，環(huán)境變量均在系統(tǒng)變量中設(shè)置，盡量避免在當(dāng)前用戶下設(shè)置環(huán)境變量。
     • 新建JAVA_HOME ，值：C:\Program Files\Java\jdk1.8.0_191（文件所在的路徑）
     • 新建CLASSPATH ，值：.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar;（可以直接復(fù)制，注意別把前面的點(diǎn)遺漏了）
     • 修改path：添加值：【jdk安裝路徑】\bin和【jdk安裝路徑】\jre\bin，其實(shí)就是 JAVA_HOME的值添加上"\bin"和"\jre\bin"
     • 驗(yàn)證：控制臺(tái)敲命令行 java -version 有打印java相關(guān)版本信息即可
2. 安裝sdk
   • 安裝完成點(diǎn)擊屏幕左下角的window，可以在最近添加了看到新添加了SDK manage和AVD manage。
   • 配置android sdk 的環(huán)境。
     • 新建ANDROID_HOME 值： C:\Program Files (x86)\Android\android-sdk(你sdk的路徑)
     • path里添加分別添加：%ANDROID_HOME%\platform-tools和%ANDROID_HOME%\tools
     • 打開SDK manage 配置國內(nèi)鏡像網(wǎng)站（避免被墻,不能xufu下載_.),不再廢話跟著我的提示來：選擇tool->options:proxy serve:mirrors.neusoft.edu.cn和端口port:80 ，點(diǎn)擊close ,再重啟或者點(diǎn)擊packages->reload. 服務(wù)器代理設(shè)置就完成了，接下來下載我們需要的東西。
     • 此時(shí)我們可以看到SDK Manage 的面板上有很多復(fù)選框選項(xiàng)，勾選父級(jí)tool，extras和 你需要的android版本。 我下載了android 8.1 和android 7.1 版本。

此步基于已經(jīng)安裝了jdk，并配置了環(huán)境變量

3. Apache Ant 下載安裝及配置。

   • 下載：下載版本 apache-ant-xxxx-bin.tar.gz
   • 安裝：解壓到你指定的文件就行
   • 新增ANT_HOME: D:\config\ant\apache-ant-1.10.5（你文件解壓的路徑）
     path新增行：D:\config\ant\apache-ant-1.10.5\bin（路徑+"\bin"）；
   • 測試：命令行 ant -v ，打印出版本號(hào)和其他即安裝成功（忽略提示not found ,failed等信息）

4. 安裝配置 gradle-4.10

   • 安裝 ：解壓到指定的文件夾即可
   • 配置：path:新增 D:\config\gradle\gradle-4.10\bin(即文件路徑+\bin)

5. 安裝nodejs

   • 安裝時(shí)記得勾選提示"是否安裝node依賴的環(huán)境"，這樣可以免去你再費(fèi)心力的去安裝python2.x 的開發(fā)環(huán)境。
   • npm 設(shè)置淘寶鏡像
     //設(shè)置 ：npm config set registry https://registry.npm.taobao.org
     //驗(yàn)證是否成功 ：npm config get registry
   • npm i ionic cordova -g 全局安裝

配置淘寶鏡像 ——是為了避免被墻導(dǎo)致安裝失敗或者安裝慢等問題。

6. webApp的開發(fā)和構(gòu)建（只考慮browser和android平臺(tái)）
   • 創(chuàng)建應(yīng)用 ：ionic start myApp blank
   • 給App添加目標(biāo)平臺(tái): ionic cordova platform add android -s
     ionic cordova platform add ios -s （-s將他們保存在config.xml中） 添加之后查看平臺(tái)設(shè)置：ionic cordova platform ls
   • 運(yùn)行
     1. 瀏覽器：ionic cordova run browser
     2. 打包生成apk：ionic cordova build android
     3. 模擬器：打開AVD manage 配置模擬器并開機(jī) 再執(zhí)行ionic cordova emulate android
        • 配置模擬器時(shí)error解決方案:

        emulator: ERROR: 參考博文
        補(bǔ)充：Starting emulator for AVD 'AN9'
        emulator: ERROR: x86 emulation currently requires hardware acceleration!
        Please ensure Intel HAXM is properly installed and usable.
        CPU acceleration status: HAXM must be updated (version 1.1.1 < 6.0.1).
        解決方案：此時(shí)修改CPU/ABI 選擇為 android wear arm / arm