一. 按照ionic 文档:http://ionicframework.com/docs/cli/
使用windows注意要用管理员身份运行cmd或powershell安装CLI,否则正常创建项目后,再运行一些ionic命令会提示找不到ionic CLI.
第一篇文档正常运行后的成果是:
ionic serve
我们可以在PC端浏览器上看到第一个ionic demo正常运行。
二. 那接下来就是打包apk看看怎么样了,我使用的是Intellij Idea或webstorm.idea或webstrom,配置ionic支持可见jetbrains官方文档:https://confluence.jetbrains.com/display/IntelliJIDEA/PhoneGap%2C+Cordova+and+Ionic
OK,按照文档配置完成,可以直接在idea打开一个Terminal,输入:
ionic cordova add android //添加android相关配置
ionic cordova run android
如果是机器上已经有符合要求的android sdk版本,那就可以直接运行成功了,否则会报需要android SDK的错误.
cordova对应的android版本可以看这里:
https://cordova.apache.org/docs/en/latest/guide/platforms/android/index.html
三. 按照以上两步去做,第一个demo运行打包apk应该都没问题了,然后可以把ionic的一些控件下载下来看看什么样子:https://github.com/ionic-team/ionic-preview-app
执行
ionic serve
可以在PC端看到效果
如果是执行ionic cordova run android或者打包ionic cordova build android,最终在手机上运行可能会报一个错误
Application Error - The connection to the server was unsuccessful. (file:///android_asset/www/index.html)
ionic cordova打包成apk,实际上是套了一个外壳,主要内容是用webview去加载的,这个问题的原因有可能是index.html需要加载的资源太多,所以打开index.html超时了,找不到文件。我去搜了下有两个个方法可以处理这个问题。
- 默认加载URL的时间应该比较短,具体是多少没有去深究,我们可以将加载URL的时间设置的长一些。参考的是stackoverflow上的这个回答:https://stackoverflow.com/questions/12319809/application-error-the-connection-to-the-server-was-unsuccessful-file-andr。
具体在项目根路劲下修改config.xml文件,添加:
<preference name="loadUrlTimeoutValue" value="200000" />
这个方法需要修改生成的android程序下的assert\www\index.html