MAC OSX环境下cordova+Ionic的安装配置

来源:互联网 发布:淘宝商城 天猫裙子 编辑:程序博客网 时间:2024/05/01 09:39

几个月之前开始接触混合式的APP开发,主要用到了cordova+Ioinc框架,还有就是angularjs,开发的第一步就是安装配置开发环境,刚刚开始项目的时候在网上参考别人的安装步骤安装cordova+Ionic发现windows+android的安装的文档更多一点。OSX环境的比较少,今天正好公司有一台MAC测试机器需要安装环境我就把安装步骤记下来了,到这里分享一下,让大家都少走弯路。也给自己一个备份,分享快乐。

步入正题:一下图文解说(图是我安装时截的图)
安装之前你要保证机器上xcode(ios的集成开发环境,添加ios时需要)已经安装完成(如果xcode安装不了你要看看系统版本和xcode兼容的最低系统版本,系统版本低则要先升级osx系统版本几个G吧,慢慢来)
关于xcode怎么下载安装我这里就不多说了,需要一个apple ID http://jingyan.baidu.com/album/b87fe19eb309f0521835682f.html?picindex=5这里有,安装完成之后也不用配置环境变量,会自动添加,要有管理员权限

1、安装cordova之前要安装nodejs 会包含npm安装(npm是个包管理器),到官网下载https://nodejs.org/en/download/ 是个pkg包下载之后双击下载包运行然后 step by step,osx下会自动添加环境变量,不用手动配置,默认安装到、usr/local下,可以更改目录
nodejs官网
2、安装完成之后检查安装是否成功打开命令行输入一下两个命令(输出版本号就是成功)
这一步一般没问题

$node -v$npm -v

3、这一步就可以安装cordova了(git不用安装,osx和linux都自带git,可以在命令行输入 git -v检查一下)
这一步的主要问题是cordova安装包的镜像问题,由于镜像在国外国内网络不行,出现安装失败的情况。这就要使用代理,在命令行输入一下两个命令

$npm config set registry http://registry.cnpmjs.org$sudo npm install -g cordova

第一个命令式配置代理
第二行全局安装cordova -g代表全局,需要root权限所以要sudo,需要管理员密码
如下图:前半部分的error是由于我没设置代理所以报错,显示下半部分就是安装成功了

4、输入如下命令测试是否安装成功

$cordova -v

如下则成功

下面就写一个demo测试一下吧
按照官网的步骤来就没错
创建一个hello的文件夹和一个项目

$ cordova create hello com.example.hello HelloWorld

进入文件夹

$ cd hello

添加ISO平台

$ cordova platform add ios

build项目

$ cordova build ios

启动ios模拟器

$ cordova emulate ios

如图:

看到如下ios模拟器界面表示成功

分割线,如果你的项目没有用到ionic框架就不用往下看了
—————————————————————————————
Ioinc安装,cordova安装完成之后ionic安装就简单多了
直接一个命令安装,一个命令测试

$sudo npm install -g ionic$ionic -v

如图:

重点来了,看到花蓝线的那行了么?
它建议安装如图那天命令,所以要执行如图那条命令,否则可能失败

$sudo npm install -g ios-sim

这样就好啦,ionic的例子我就不写了,官网有和cordova差不多,照着命令敲就行
http://ionicframework.com/getting-started/

以上的所有安装的目录都会在命令行里提示出来。

好了,分享完了,也给自己一个备份以后用,一起进步。

1 0
原创粉丝点击