Cordova&Ionic安裝操作詳細步驟武深龍2017-07-06備注：本文檔所介紹安裝的軟件，建議運行PC機是64位，建議PC的內存配置至少4G以上，本人最初用32位虛擬機，3G內存的win7配置下面步驟，吃盡了苦頭特此說明;另外當本人重新安裝64位虛擬win7后，由于心慈手軟竟然只分配了40G的磁盤空間，結果完成下面操作后40G硬盤空間竟然所剩無幾，因此建議項目組其他成員在執行下述過程時，盡量選擇較大磁盤空間；另外第一次安裝并執行命令時，有許多支持包需要在線下載，所以務請選擇網速較好時進行第一次操作，否則由于網絡延遲造成命令執行失敗，則容易出現第二次執行仍然失敗現象，切記！切記！！！。打開瀏覽器登錄網址如下/en/download/current/下載最新的Node.js版本本文檔以下載8.1.3版本為例說明雙擊所下載文件進行安裝，本文檔安裝在c:\nodejs目錄下，安裝成功的標識如下圖所示在Node.js基礎上安裝Cordova,安裝命令如下c:\nodejs>npminstall-gcordova安裝過程可能會比較慢，具體的快慢取決于網速和當前網絡環境，不排除網站已經被屏蔽的可能性，如果中途安裝失敗還是一個比較麻煩的事，因為第一次安裝失敗可能會造成無法進行第二次安裝，需要完全卸載Node.js并且將目錄刪除干凈，重新安裝Node.js后再執行上述操作,總之耐心等待，都是網絡屏蔽惹的禍沒辦法，具體如下圖所示：Cordova安裝成功的標志如下圖所示下載安裝JDK并配置環境變量安裝過程略過，安裝完成后首先配置JAVA_HOME如下圖所示配置PATH如下圖所示配置CLASSPATH如下圖所示:配置完全正確的檢驗方法如下圖：安裝ADT首先下載ADT具體網址如下：本文檔以安裝在C:\android-sdk為例，如下圖所示：安裝后進入進度如下界面，為了讓后面的操作步驟順暢，此處建議選擇全部安裝，只是全部安裝占用空間較大，而且下載需要花費很長時間，如下圖所示：在環境變量path中配置如下：C:\android-sdk\platform-tools;C:\android-sdk\tools，具體如下圖所示：安裝ant下載地址如下：下載后解壓到c:\apache-ant目錄下配置環境變量如下：Ant安裝成功的標志是在dos窗口下執行命令，返回大致如下圖所示：下載配置Gradle下載網址如下：/releases/本文檔以安裝在c：\gradle目錄下為例來說明首先配置GRADLE_HOME如下圖所示然后在path中加入c:\gradle\bin，如下圖所示：此部分配置成功的標志是執行如如下命令，dos窗口返回如下：用cordova創建項目此時在c:\myproject目錄下創建一個完整的cordova工程，如下圖所示：文檔作者將已經開發的demo放置在www目錄下，如下圖所示：添加安卓平臺執行如下圖所示命令首次編譯輸入命令如下圖所示：c:\myproject\zsyy\cordovabuildandroid第一次編譯需要下載指定版本的Gradle，由于從國外網站下載可能網速會比較慢，因此可能會造成編譯不成功，我就下載了好多次未成，最終選擇一個早晨網速很好的時候重新執行方才下載完成，頁面截圖大致如下：將Crosswalk集成到工程當中上述配置過程打出的包優點是比較小，缺點是需要調用系統中的webview，由于各種老舊webview對HTML5/CSS3支持的不好，在android各版本調試CSS兼容性簡直就是噩夢，因此需要安裝Crosswalk。安裝Crosswalk的優點是解決了androidwebview碎片化問題，還支持各種HTML5/CSS3新語法，缺點是會使安裝包增大20M左右。執行命令如下:cordovapluginaddcordova-plugin-crosswalk-webview成功后系統截圖提示如下：Crosswalk安裝成功后再執行打包命令，得到的apk包大致如下圖所示：安裝Ionic執行命令大致如下：c:\nodejs\npminstall-gionic安裝成功的標志是執行如下命令：c:\nodejs\ionic-v返回當前下載的ionic版本號，如下圖所示：創建Ionic應用執行命令大致如下：c:\myproject\ionicstartmyapptabs頁面返回如下圖所示，如果是第一次創建應用會經過漫長的下載等待：頁面提示選擇y工程創建完畢虛擬環境運行所創建Ionic工程首先進入所創建工程目錄，運行命令大致如下：c:\myproject\myapp\ionicserve默認安裝Chrome并且在按F12后返回頁面大致如下：添加安卓平臺在項目目錄下執行如下命令添加安卓平臺c:\myproject\myapp\ioniccordovaplatformaddandr