二、初识Ionic
1.Ionic是什么
IONIC 是目前最有潜力的一款 HTML5 手机应用开发框架。通过 SASS 构建应用程序，它提供了很多 UI 组件来帮助开发者开发强大的应用。 它使用 JavaScript MVVM 框架和 AngularJS 来增强应用。提供数据的双向绑定，使用它成为 Web 和移动开发者的共同选择。Ionic是一个专注于用WEB开发技术，基于HTML5创建类似于手机平台原生应用的一个开发框架。Ionic框架的目的是从web的角度开发手机应用，基于PhoneGap的编译平台，可以实现编译成各个平台的应用程序。
在html5移动app开发中,速度是很重要的。Ionic在最新的移动设备中表现非常卓越，运行非常流畅。 操作最少的 DOM，非 jQuery，和硬件加速过渡，让您感觉到用html5开发的app也可以飞起来。
2.cordova是什么
cordova前身是phonegap,主要用它的插件。用于将html、css和javascript打包成app
3.ngCordova是什么
ngCordova是在Cordova Api基础上封装的一系列开源的AngularJs服务和扩展，让开发者可以方便的在HybridApp开发中调用设备能力，即可以在AngularJs代码中访问设备能力Api，诸如访问文件，摄像头，GPS等等，这些插件只需要简单配置就可以在ionic中使用。
二、安装cordova和ionic
1.安装ionic前确保你的Mac已安装Xcode（在App Store搜索下载安装）
2.安装cordova之前要安装nodejs
nodejs官网 https://nodejs.org/en/
1>.选择安装最新的版本：
nodejs官网
2>.下载后点击安装包，整个过程非常傻瓜化
3>.安装完后，打开终端，输入node -v查看node版本
4>.输入npm -v查看npm的版本
查看版本
看到了node和npm的版本号，就说明node.js已经成功安装！
3.git不用安装，osx和linux都自带git，可以在命令行检查一下git版本
git --version
4.安装cordova
1>.由于cordova安装包的镜像在国外，国内网络不行，经常出现安装失败的情况。这就要使用代理，在命令行输入一下命令：
npm config set registry http://registry.cnpmjs.org
2>.用root权限全局安装cordova，在命令行输入
sudo npm install -g cordova
执行后提示输入密码，输入你的Mac开机密码即可：
3>.输入以下命令行验证cordova版本
cordova -v
验证cordova版本
5.安装ionic
（安装方法一）
1>.使用以下命令行安装ionic
sudo npm install -g ionic
2>.输入以下命令行验证版本
ionic -v
验证的时候我出现了一些问题，报错如下：
报错
百度翻译如下
百度翻译
看了更懵逼，经过查阅资料才发现没有安装运行环境
ios-sim代表模拟器运行环境,
ios-deploy代表真机运行环境。
安装iOS－sim 、iOS -deploy（切记前面加上sudo）
sudo npm install -g ios-sim
sudo npm install -g ios-deploy 这个命令可能会报错，若报错，用sudo npm install -g ios-deploy --unsafe-perm=true代替
完了之后
再次验证版本就成功了
安装成功
（安装方法二）
使用npm安装ionic：sudo npm install -g ionic，各种转圈圈，一直过不去，天朝的网，没办法，猿急了得翻墙。下面给大家分享下使用淘宝镜像cnpm安装ionic的步骤。
说明：因为npm安装插件是从国外服务器下载，受网络影响大，可能出现异常，如果npm的服务器在中国就好了，所以我们乐于分享的淘宝团队干了这事。来自官网：“这是一个完整 npmjs.org 镜像，你可以用此代替官方版本(只读)，同步频率目前为 10分钟 一次以保证尽量与官方服务同步。”
注意：前提是已经安装好 npm
1>.切换到根路径 ~ 下：cd ~
然后：open .npmrc
2>.提示找不到该文件，没关系，我们设置一下镜像地址：
npm config set registry https://registry.npm.taobao.org
该国内源会定时（每 10 分钟）从国外的 NPM 源中同步到国内，供国内使用，利国利民啊。
3>.再次跳到步骤一，就能看到npmrc文件中已经设置好了registry。
4>.接下来，安装cnpm: sudo npm install -g cnpm --registry=https://registry.npm.taobao.org
可以使用：cnpm -v 确认是否安装成功。以后加载模块直接使用 cnpm。
注意：安装完后最好查看其版本号
cnpm -v或关闭命令提示符重新打开，安装完直接使用有可能会出现错误
5>.最后安装ionic，这里我选择的是安装最新的beta版本：sudo cnpm install ionic@beta或者sudo cnpm install -g cordova ionic
6>.可以输入：ionic --version
检查是否安装成功！
三、参考资源
ionic官网：www.ionicframework.com(使用代理或百度浏览器才能看)
ionic中文站：www.ionic.wang
condova官网：http://cordova.apache.org
ngCordova官方插件：http://ngCordova.com/docs/plugins
网友评论