mac系统下ionic环境配置
本人是在mac环境下进行配置的:
下载nodejs:https://nodejs.org/download/ 并双击安装
Cordova and Ionic command-line tools 安装,直接在终端使用命令
windows:npm install -g cordova ionic
mac或linux:
sudo npm install -g cordova ionic安装
注意操作系统用户要有密码哦,不然安装过程中提示你输入密码,直接回车是通过不了的
好了,这时候该安装的都安装,下面来建一个ionic工程吧
在合适的位置执行命令创建工程
ionic start myApp
,要稍微等待一会完成工程创建,默认会创建一个有tab页的模板工程
如果工程创建成功,我们
cd myApp
目录下,执行命令
ionic serve
,会自动打开浏览器显示页面
IONIC安卓环境搭建:
1、下载ant:http://ant.apache.org/bindownload.cgi
增加环境变量
(环境变量在当前用户根目录下的.bash_profile里,如果之前没有设置过默认是没有.bash_profile文件的,可以手工创建一个。)
export ANT_HOME=/Users/apple/Documents/work/apache-ant-1.9.4
export PATH=${PATH}:${ANT_HOME}/bin
2、下载安卓sdk,并添加环境变量
export ANDROID_HOME=/Users/apple/Documents/work/android-sdk-macosx/sdk
export ANDROID_TOOLS=$ANDROID_HOME/tools
export ANDROID_PLATFORM_TOOLS=$ANDROID_HOME/platform-tools
PATH=$PATH:$ANDROID_HOME:$ANDROID_TOOLS:$ANDROID_PLATFORM_TOOLS
3、安装对应的sdk版本
点击android-sdk-macosx/tools下面的android可以打开android sdk manager,在这里选择我们要安装的sdk版本,我装的是21
注意由于国内网络问题,列表打开会很慢,ssl-google。。。连不上,显示不了我要装的sdk版本,以至于我去找vpn翻墙,但是最后不发现不需要的,过了连不上的那一步,最终还是能把所有的版本刷出来的,但是要耐心等待很久,真的很久很久。。。
4、给项目添加安卓
ionic platform add android
一开始我下载的安卓sdk没有安装21这个版本,因此报错了
[Error: Please install Android target: "android-21".
Hint: Open the SDK manager by running: /Users/apple/Documents/work/adt-bundle-mac-x86_64-20131030/sdk/tools/android
You will require:
1. "SDK Platform" for android-21
2. "Android SDK Platform-tools (latest)
3. "Android SDK Build-tools" (latest)]
参考上一步进行相应版本的安装即可
过程还还出现了下面的错误
Error: ANDROID_HOME is not set and "android" command not in your PATH. You must fulfill at least one of these conditions.
给目录设置写权限既可以解决 chmod -R 777 android-sdk-macosx
4、编译
ionic build android
中间发生错误:
ERROR : No emulator images (avds) found.
是因为我用了这个命令,
sudo ionic build android
不用加sudo来add 和build ,否则要先把模拟器打开再执行这个命令
编译成功后会在platforms/android/ant-build目录下生成apk文件,直接传到手机上就可以安装运行啦
5、模拟器运行
ionic emulate android
这个很慢,其实最后开发中基本都不用模拟器运行,直接在浏览器进行调试就ok了
IONIC IOS环境搭建:
因为是在mac系统下进行配置,所以容易多了
1、安装ios模拟器
sudo npm install -g ios-sim
2、添加ios平台、编译、模拟器运行
ionic platform add ios ionic build ios
ionic emulate ios
.
mac系统下ionic环境配置的更多相关文章
- MAC系统下Sublime Text3 配置Python3详细教程
MAC系统下Sublime Text3 配置Python3详细教程(亲测有效) https://blog.csdn.net/weixin_41768008/article/details/798590 ...
- mac系统下Eclipse + pydev配置python Interpreter
mac系统下Eclipse + pydev配置python Interpreter 之前都在windows下使用Eclipse + pydev 进行开发,未发现什么异常,最近对wxpy.itcha ...
- mac系统下docker安装配置mysql详细步骤
上文介绍了MacOS安装Docker傻瓜式教程,安装好后第一件事就决定把本地数据库迁移过来,那么首先就得安装mysql,下面就开始我们的安装之旅吧. 一.docker配置镜像加速器 我们使用docke ...
- iOS Mac系统下Ruby环境安装
由EasyIOS引出的一系列问题:转载的上一篇CocoaPods安装和使用教程中说明了,为什么要使用cocoapods ,但是要安装cocoapods需要Ruby环境,安装Ruby环境首先需要安装Xc ...
- [转]MAC系统下Sublime Text3 配置Python3详细教程(亲测有效)
原文地址: https://blog.csdn.net/weixin_41768008/article/details/79859008?tdsourcetag=s_pctim_aiomsg 这段时间 ...
- Windows系统下pthread环境配置
记录下win7系统,vc6.0++编译器下配置POSIX多线程环境的步骤. 配置 下载地址 ftp://sourceware.org/pub/pthreads-win32/ 我下载的版本是 fpthr ...
- mac系统下Ruby环境安装
在我们编写代码过程中,会用到一系列的第三方开源类库,我们可以选择手动去一个个添加需要的库,但这非常麻烦.因此我们可以使用CocoaPods来帮助我们自动添加.使用CocoaPods需要先安装Ruby环 ...
- Mac CLion下OpenGL环境配置
1. 配置glew和glfw 终端下运行下面两句,安装完后在/usr/local/Cellar/下可以找到对应的目录. brew install glew brew install glfw3 效果如 ...
- Mac 系统下的环境变量
1.查看电脑环境变量 -->echo $PATH 2. 新建环境变量 sudo vim ~/.bash_profile 输入密码 3. 按 I ,编辑新的环境变量地址,保存 退出 :w ...
随机推荐
- Oracle问题诊断过程常用SQL
--查看临时表空间使用情况select tablespace_name ,sum(size_mb),sum(used_mb),round(sum(used_mb)/sum(size_mb),2) fr ...
- Short Circuit Protection Circuit
http://www.daycounter.com/Circuits/Short-Circuit-Protection/Short-Circuit-Protection.phtml Short cir ...
- 转 dockerfile 介绍 及 编写
Docker简介 Docker项目提供了构建在Linux内核功能之上,协同在一起的的高级工具.其目标是帮助开发和运维人员更容易地跨系统跨主机交付应用程序和他们的依赖.Docker通过Docker容器, ...
- ldap安装配置过程中遇到的错误,以及解决方法
错误1: [root@openldap openldap]# ldapsearch -LLL-W -x -H ldap://etiantian.org -D "cn=admin,dc=eti ...
- 字符函数PATINDEX()与STUFF()
函数 PATINDEX() STUFF() 取数字 英语 汉字 更多:http://msdn.microsoft.com/zh-cn/library/ms188395.aspx PATINDEX() ...
- C# 模拟网站登陆
实现此功能首先需要借助一些抓包工具,对相应的网站登陆过程进行分析,此过程根据网站的不同,可能复杂,也可能很简单.常用的抓包工具FF下FireBug和IE下的HttpWatch.这两个工具很强大,以此工 ...
- select点击option获取文本输入框的焦点事件
HTML文件: <select id="secOrderNum" style="margin-bottom:10px;width:90px;" data- ...
- [Android Pro] activity-alias的使用
activity-alias是android里为了重复使用Activity而设计的. 当在Activity的onCreate()方法里,执行getIntent().getComponent().get ...
- Android网络请求之OkHttp框架
首先声明权限 <uses-permission android:name="android.permission.INTERNET"/> 在build.gradle中加 ...
- 数学图形(1.2)Sin曲线
相关软件参见:数学图形可视化工具,使用自己定义语法的脚本代码生成数学图形.该软件免费开源.QQ交流群: 367752815 Sin曲线 vertices = x = *PI) to (*PI) y = ...