ionic環境搭建及新建項目中的各類問題

具體流程可見http://bbs.ionic-china.com/read-7.html

 

問題1.安裝ionic cordova失敗

解決方法：修改npm的源，npm config set registry 「http://registry.cnpmjs.org」，輸入npm config list（或者npm config get registry）查看是否設置成功，再試試可否安裝成功；不行再使用淘寶鏡像網站，npm config set registry " https://registry.npm.taobao.org "；

參考信息：http://www.cnblogs.com/wjw-blog/p/4840727.html

 

問題2.ionic start myApp tabs報錯

沒截圖，只能找到項目根目錄下的npm-debug.log（start成功不會存在這個文件）中的相關信息，以下：

error Windows_NT 6.3.9600
error argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "ionic:build" "--"
error node v6.3.1
error npm  v3.10.3
error code ELIFECYCLE
error ionic-app-base@ ionic:build: `ionic-app-scripts build`
error Exit status 1
error Failed at the ionic-app-base@ ionic:build script 'ionic-app-scripts build'.
error Make sure you have the latest version of node.js and npm installed.
error If you do, this is most likely a problem with the ionic-app-base package,
error not with npm itself.
error Tell the author that this fails on your system:
error     ionic-app-scripts build
error You can get information on how to open an issue for this project with:
error     npm bugs ionic-app-base
error Or if that isn't available, you can get their info via:
error     npm owner ls ionic-app-base
 error There is likely additional logging output above.
 verbose exit [ 1, true ]

 

從報錯信息能夠看出，多是node.js和npm版本過低問題，可是我明明是能夠build公司項目apk的，加上從新安裝node.js而後各類再來一遍太慢，我就試着別的方法。

解決方法：將npm源設置爲「http://registry.cnpmjs.org」；

              打開node.js安裝目錄下的node_modules\npm\npmrc,在第二行添加registry=http://registry.cnpmjs.org（親測無用，後來改回來了，而後再新建就成功了，因此我也不知道究竟是怎麼解決的，可能網絡問題？）

 

 問題3：ionic platfrom add android報錯

報錯信息：

C:\project\ionic\app1>ionic platform add android
function bold() { [native code] } https://github.com/driftyco/ionic-default-reso
urces/archive/master.zip
[=============================]  100%  0.0s
Adding android project...

Creating Cordova project for the Android platform:
        Path: platforms\android
        Package: com.ionicframework.app1783359
        Name: app1
        Activity: MainActivity
        Android target: android-24

Subproject Path: CordovaLib

Android project created with cordova-android@6.0.0


ls: no such file or directory: C:\project\ionic\app1\res\mipmap-*


Installing "cordova-plugin-console" for android


ANDROID_HOME=C:\Users\momo\AppData\Local\Android\sdk
JAVA_HOME=C:\Program Files\Java\jdk1.8.0_111

Subproject Path: CordovaLib

Unzipping C:\Users\momo\.gradle\wrapper\dists\gradle-2.14.1-all\53l0mv9mggp9q5m2
ip574m21oh\gradle-2.14.1-all.zip to C:\Users\momo\.gradle\wrapper\dists\gradle-2
.14.1-all\53l0mv9mggp9q5m2ip574m21oh


Exception in thread "main"
java.lang.RuntimeException: java.util.zip.ZipException: error in opening zip fil
e
        at org.gradle.wrapper.ExclusiveFileAccessManager.access(ExclusiveFileAcc
essManager.java:78)
        at org.gradle.wrapper.Install.createDist(Install.java:47)
        at org.gradle.wrapper.WrapperExecutor.execute(WrapperExecutor.java:129)
        at org.gradle.wrapper.GradleWrapperMain.main(GradleWrapperMain.java:48)
Caused by: java.util.zip.ZipException: error in opening zip file
        at java.util.zip.ZipFile.open(Native Method)
        at java.util.zip.ZipFile.<init>(ZipFile.java:219)
        at java.util.zip.ZipFile.<init>(ZipFile.java:149)
        at java.util.zip.ZipFile.<init>(ZipFile.java:163)
        at org.gradle.wrapper.Install.unzip(Install.java:160)
        at org.gradle.wrapper.Install.access$400(Install.java:29)
        at org.gradle.wrapper.Install$1.call(Install.java:70)
        at org.gradle.wrapper.Install$1.call(Install.java:47)
        at org.gradle.wrapper.ExclusiveFileAccessManager.access(ExclusiveFileAcc
essManager.java:65)
        ... 3 more

Failed to install 'cordova-plugin-console':Error: cmd: Command failed with exit
code 1
    at ChildProcess.whenDone (C:\project\ionic\app1\platforms\android\cordova\no
de_modules\cordova-common\src\superspawn.js:169:23)
    at emitTwo (events.js:106:13)
    at ChildProcess.emit (events.js:191:7)
    at maybeClose (internal/child_process.js:852:16)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:215:5)

Error: cmd: Command failed with exit code 1

解決方法：從報錯信息C:\Users\momo\.gradle\wrapper\dists\gradle-2.14.1-all\53l0mv9mggp9q5m2 ip574m21oh\gradle-2.14.1-all.zip 能夠看出應該是解壓該文件的時候出了問題，因此下載一個新的gradle壓縮包進行替換，建議下載比原來目錄版本高的，因爲連接裏沒有2.14.1，我下載了2.14，可是運行報錯顯示最低版本不能低於2.14.1，而後再下載3.0的試用，運行成功。下載地址：http://gradle.android-studio.org/

問題解決參考連接：http://stackoverflow.com/questions/29874564/ionic-build-android-error-when-download-gradle檢查cordova可否正常工做方法：

cordova create workshop com.yourname.workshop Workshop
cd workshop
cordova platforms add ios或android
cordova build 

 

問題4：建立ionic2項目時出錯，start後報錯：

Error with start undefined
Error Initializing app: There was an error with the spawned command: npminstall
There was an error with the spawned command: npminstall
Caught exception:
undefined

有時start時不報錯，可是建立完後www文件夾下文件不完整，ionic serve後網頁顯示：Error: ENOENT: no such file or directory, open 'd:\ionicProject\appv2\www\index.html'，查看ionic版本，爲2.1.0-beta.3。

解決方法：查閱資料，發現說是這個bug在beta22已經修復，因此感受是ionic的問題，因此npm stall -g ionic，安裝後版本爲2.2.1，再start項目，而後ionic serve正常，www文件夾下的文件也全了。

 

 

命令行語句彙總：

npm config set registry " https://registry.npm.taobao.org "(直接修改npm源)
npm config list (查看npm設置)
cnpm install -g cordova ionic（安裝cordova ionic） cnpm update -g cordova ionic（更新cordova ionic）
npm cache clean(清除緩存)
ionic -help（查看幫助）
ionic -v（查看版本）
ionic info(查看ionic環境)

ionic start myApp blank（空項目）
ionic start myApp tabs（帶導航條）
ionic start myApp sidemenu（帶側滑菜單）

ionic platform add android（添加android平臺）
ionic platform remove android（移除android平臺）
ionic build android（編譯項目apk）
ionic emulate android（運行項目apk 手機鏈接在手機運行 模擬器鏈接在模擬器運行）
ionic run android （至關於build + emulate）
ionic serve（開啓服務調試）

 

 

結語：新建ionic項目問題可能會不少，並且是以前java、android和js項目所沒有的錯誤，一開始真的是懵逼的。在查資料解決問題的過程當中，又看到碼友說運氣好的很快建成，運氣很差的折騰一週才弄好，而我就是那個運氣很差的。。。。不過索性也弄好了，祝看到這篇小記的朋友運氣好點。