Alan Hou的个人博客

用Ionic完成APP开发

安装

npm install -g ionic
#指定版本
npm install -g ionic@2.0.0-beta2.2
#补充
npm install -g cordova

初始化空项目

ionic start ionicdemo --v2
################################################
Run your app in the browser (great for initial development):
  ionic serve
Run on a device or simulator:
  ionic run ios[android,browser]
Test and share your app on device with Ionic View:
  http://view.ionic.io
################################################

#下载完毕后,启动服务
cd ionicdemo/
ionic serve

工具

iOS: Xcode(App Store下载慢可通过http://adcdownload.apple.com/Developer_Tools/Xcode_8.1/Xcode_8.1.xip下载)

Android: Android Studio, GENYMOTION
浏览器参数:

?ionicplatform=ios
?ionicplatform=android

7个生命周期钩子函数:

onPageLoaded
onPageWillEnter
onPageDidEnter
onPageWillLeave
onPageDidLeave
onPageWillUnload
onPageDidUnload

相关链接:

http://ionicframework.com/

http://ionic.io/

https://github.com/driftyco/ionic

http://ionichina.com/

http://ionicframework.com/docs/v2/ionicons/(Ionic 1.x:http://ionicons.com/)

http://ngcordova.com/

http://learnangular2.com/

iOS & Android图标、启动页面

http://makeappicon.com/

http://ios.hvims.com/

https://romannurik.github.io/AndroidAssetStudio/

http://iconhandbook.co.uk/reference/chart/android/

https://material.google.com/style/icons.html

常见问题

1.通过ioniv -v查看所安装的版本,在安装过程中出现

******************************************************
 Dependency warning - for the CLI to run correctly,      
 it is highly recommended to install/upgrade the following:     

 Please install your Cordova CLI to version  &amp;gt;=4.2.0 <code>npm install -g cordova</code>
 Install ios-sim to deploy iOS applications.<code>npm install -g ios-sim</code> (may require sudo)
 Install ios-deploy to deploy iOS applications to devices.  <code>npm install -g ios-deploy</code> (may require sudo)

******************************************************
2.1.0-beta.3

根据提示执行

npm install -g cordova
sudo npm install -g ios-sim
#使用sudo npm install -g ios-deploy时出现如下报错
#npm WARN lifecycle ios-deploy@1.9.0~preinstall: cannot run in wd %s %s (wd=%s) ios-deploy@1.9.0....
#使用如下命令安装
sudo npm install -g ios-deploy --unsafe-perm=true

2.下载速度很慢或不稳定,请翻墙进行下载,或者使用cnpm

#方法一
npm install -g cnpm --registry=https://registry.npm.taobao.org
#方法二
alias cnpm="npm --registry=https://registry.npm.taobao.org \
--cache=$HOME/.npm/.cache/cnpm \
--disturl=https://npm.taobao.org/mirrors/node \
--userconfig=$HOME/.cnpmrc"

但以上方法仅能解决直接使用npm安装时的问题,对于ionic start这类的指令可通过
a. Windows下配置npmrc
默认路径:C:\Program Files\nodejs\node_modules\npm\npmrc
在npmrc文件中添加:registry=http://registry.cnpmjs.org
b. Mac下通过npm config set registry “https://registry.cnpmjs.org”进行设置,也可使用配置文件操作
查看用npm config ls -l或npm config get registry(修改前为https://registry.npmjs.org/)

3.出现报错

fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.

sudo npm update -g npm

4.Atom下安装atom-typescript
如无法通过apm或Settings安装,在Github上下载该安装包(https://github.com/TypeStrong/atom-typescript),解压到~/.atom/packages下,然后cd到atom-typescript目录中,运行npm install完成安装再打开Atom,有可能会提示安装linter,安装完成之后即可正常使用。

退出移动版