公司沒有IOS和沒有安卓開發(fā)人員,，前端后端都是需要自己玩前幾天技術(shù)經(jīng)理說有一個需求要把webapp封裝成Hybrid App,，現(xiàn)已完成。記錄一下從中遇到的問題和需要用到的開發(fā)環(huán)境的配置

將Webapp封裝成Hybrid App有如下步驟

        1.下載安裝1.8的JDK,，并且配置環(huán)境變量        （注意：最新版本的cordova，必須要下載1.8的JDK不然會報錯）

        2.下載安裝Ant構(gòu)建工具并且配置環(huán)境變量      （注意：Ant目錄不能是中文，不然編譯不成功）

        3.下載安裝android并且配置開發(fā)環(huán)境

        4.下載安裝Node.js

        5.使用npm安裝cordova全局環(huán)境

        6.使用cordova創(chuàng)建cordova項目

        7.將cordova編譯為android項目

        8.安裝.apk文件

        9.Eclipse安裝ant插件

        10.導(dǎo)入創(chuàng)建好的android項目

        11.下載安裝連接第三方模擬器 (注意：這里舍棄了自帶的android模擬器使用第三方的,，因為android自帶的模擬器半天才打開，又不支持window系統(tǒng)下載x86)

         以下是百度云的鏈接,，打包所需要的所有工具,、插件、安裝包都在里面

        鏈接：http://pan.baidu.com/s/1mhQYD0s 密碼：7x16

1.JDK的配置環(huán)境如下：

      在環(huán)境變量新建系統(tǒng)變量 變量名：JAVA_HOME  變量值為：安裝路徑的根目錄即可（C:\Program Files\Java\jdk1.8.0_111）

2.安裝Ant構(gòu)建工具如下：

    1.  新建系統(tǒng)變量   變量名：ANT_HOME  變量值為：安裝路徑的根目錄即可（D:\phonegap\apache-ant-1.9.8） 把bin目錄的路徑添加到path里面

          添加到path的截圖如下：

         完成以上兩點之后打開cmd輸入  java -version 和 ant -version 出現(xiàn)以下如則安裝成功,，否則請檢查配置的環(huán)境變量路徑

3.安裝android開發(fā)環(huán)境配置如下：

     解壓后的目錄是如下圖：

    1.將SDK目錄下的：platform-tools,、tools添加到環(huán)境變量的path里面去

    2.安裝完成后cmd運行adb 如圖則安裝成功,，

4.下載安裝Node.js

     下載下來的包含有Node.js安裝包直接安裝即可，無需配置環(huán)境

5.使用npm安裝cordova全局環(huán)境

    1.運行cmd

    2..輸入此命令:  npm install -g cordova   回車        這里需要等待一段時間        如以下圖說明安裝成功    因為我已經(jīng)安裝過了

        可運行cordova -v 查看是否安裝成功,，如圖示 6.4.0版本的cordova 如圖

6.使用cordova創(chuàng)建cordova項目

      1.切換到任意路徑 輸入命令：cordova create myapp    回車

      2.進入項目輸入命令：  cd myapp   回車

7.將cordova編譯為android項目              （注意：如何報android-24的錯誤,，請在添加平臺時修改兩個文件

                                                                                      1. D:\phonegap\myapp\platforms\android目錄下的project.properties文件將24改成25

                                                                                      2. D:\phonegap\myapp\platforms\android\CordovaLib目錄下的project.properties文件將24改成25即可）

    1.添加安卓平臺輸入命令：cordova platform add android    回車

     添加成功如下：

     檢查環(huán)境是否配置好：輸入命令： cordova requirements          回車        出現(xiàn)以下則OK

8.安裝.apk文件

     如果以上都完成了就開始構(gòu)建安卓.apk    

     輸入命令： cordova build android   回車   如下圖則構(gòu)建成功

   此時此刻你的D:\phonegap\myapp\platforms\android\build\outputs\apk  有一個apk的文件  到了這里ok說明你已經(jīng)成功了  

            現(xiàn)在的目錄結(jié)構(gòu)為：

                       現(xiàn)在將webapp移動端項目copy到www目錄下，將原先的文件刪掉,，如圖   主程序入口在config.xml配置（后綴不能是.jsp）

                         （注意：所以的請求必須是絕對路徑）

9.Eclipse安裝ant插件

    打開Eclipse--->Help--->Install New Software---出現(xiàn)以下

       Ant插件安裝成功后重啟Eclipse ----->添加SDK所在的目錄

    10.導(dǎo)入創(chuàng)建好的android項目

           File--->New--->project-->

           選擇上面創(chuàng)建好的安卓項目   勾選兩個就行了    CordovaLib,、MainActivity

  11.下載安裝連接第三方模擬器

          先下載安裝第三方模擬器（注意：模擬器要打開才能連接成功）

          下載安裝完成后運行cmd 連接第三方模擬器  輸入命令   adb connect 127.0.0.1:26944  回車   ---》26944是第三方模擬器的端口號

    此時進入Eclipse---》Window---Show View-->Devices則出現(xiàn)以下圖

     運行MainActivity---》Run As---》Android-Application  出現(xiàn)如下界面   選擇第三方模擬器  OK

 模擬器出現(xiàn)如下圖則運行成功OK

          將apk安裝包發(fā)送到手機進行安裝如下效果：

         希