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.
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
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 [ , 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
[=============================] % .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- Subproject Path: CordovaLib Android project created with cordova-android@6.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..0_111 Subproject Path: CordovaLib Unzipping C:\Users\momo\.gradle\wrapper\dists\gradle-2.14.-all\53l0mv9mggp9q5m2
ip574m21oh\gradle-2.14.-all.zip to C:\Users\momo\.gradle\wrapper\dists\gradle-
.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:)
at org.gradle.wrapper.Install.createDist(Install.java:)
at org.gradle.wrapper.WrapperExecutor.execute(WrapperExecutor.java:)
at org.gradle.wrapper.GradleWrapperMain.main(GradleWrapperMain.java:)
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:)
at java.util.zip.ZipFile.<init>(ZipFile.java:)
at java.util.zip.ZipFile.<init>(ZipFile.java:)
at org.gradle.wrapper.Install.unzip(Install.java:)
at org.gradle.wrapper.Install.access$(Install.java:)
at org.gradle.wrapper.Install$.call(Install.java:)
at org.gradle.wrapper.Install$.call(Install.java:)
at org.gradle.wrapper.ExclusiveFileAccessManager.access(ExclusiveFileAcc
essManager.java:)
... more Failed to install 'cordova-plugin-console':Error: cmd: Command failed with exit
code
at ChildProcess.whenDone (C:\project\ionic\app1\platforms\android\cordova\no
de_modules\cordova-common\src\superspawn.js::)
at emitTwo (events.js::)
at ChildProcess.emit (events.js::)
at maybeClose (internal/child_process.js::)
at Process.ChildProcess._handle.onexit (internal/child_process.js::) Error: cmd: Command failed with exit code

解决方法:从报错信息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://*.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项目所没有的错误,一开始真的是懵逼的。在查资料解决问题的过程中,又看到码友说运气好的很快建成,运气不好的折腾一周才弄好,而我就是那个运气不好的。。。。不过索性也弄好了,祝看到这篇小记的朋友运气好点。

上一篇:你知道C/S和B/S两种架构有什么区别吗?


下一篇:带图片的word快速插入到博客中