为了开发HTML5,除了最新使用React Native等之外,目前首选的为稳定的ionic+Angularjs来开发iOS和android.
Ionic(ionicframework一款接近原生的HTML5移动App开发框架 会html css js就可以开发app
ionic中文教程讲解的很清楚,此网站翻译了一些原官网文档,而且也有诸多例子,让我们能够更好的学习.本教程讲述一下ionic、cordova安装的具体内容.
1. 安装npm 、node.js
1.1 打开`终端(Terminal)`,分别输入以下内容:
npm -v
node -v
![](http://upload-images.jianshu.io/upload_images/318204-3b4812d224b125ce.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
如果npm或者node可能并非最新版本或者没有安装,可以到nodejs官网下载最新版本.
![](http://upload-images.jianshu.io/upload_images/318204-9faf835b48ee3f81.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
下载好后双击下载的pkg包默认安装即可。
2.安装ionic和cordova
2.1 因为某些原因,国内的网络安装ionic和cordova 会出现错误,因此要跳过某些墙。采用淘宝NPM镜像。打开终端直接输入以下命令即可。
npm install -g cnpm --registry=https://registry.npm.taobao.org
2.2 通过淘宝NPM镜像就可以安装ionic和cordova包.
输入在终端中以下内容:
sudo cnpm install -g cordova ionic
![](http://upload-images.jianshu.io/upload_images/318204-6c6c46b375b06010.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
**ps:等待时间可能会长,请耐心等候**
输出以上内容即可安装成功。
2.3 安装成功以后,要查看安装的包内容是否全部都已安装.运行命令:
ionic info
![](http://upload-images.jianshu.io/upload_images/318204-66a3c55af0cfec38.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
上图中所显示的Not installed代表未安装,安装方式即为红色给出的内容,照着内容安装即可以.
**ps:不安装的情况下就是不能在此环境下编译等,但是对于浏览器运行无影响.**
`ios-sim`代表模拟器运行环境,
`ios-deploy`代表真机运行环境。
![](http://upload-images.jianshu.io/upload_images/318204-e10d59c3f4714ee4.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
![](http://upload-images.jianshu.io/upload_images/318204-65d7c52b42ff1480.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
**ps:博主只安装了模拟器环境**
3. 项目
3.1 项目生成
终端运行
//进入桌面
cd ./Desktop
//生成demo_1文件项目
ionic start demo_1
![](http://upload-images.jianshu.io/upload_images/318204-c59d48f0a5b32bd9.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
如果创建`iOS`应用,`终端`运行:
cd demo_1
ionic platform add ios (可能会需要sudo)
ionic build ios
ionic emulate ios //模拟器运行
原文链接:http://www.jianshu.com/p/7a7abfa9f435
著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”。