ionic2 安装教程

来源:互联网 发布:video 知乎 编辑:程序博客网 时间:2024/05/29 09:45
 1、下载安装 nodejs  https://nodejs.org/en/download/ 

     Windows Installer (.msi) 
2、使用淘宝 NPM 镜像:
 设置镜像:npm config set registry https://registry.npm.taobao.org 

 查看镜像:npm config get registry
npm install –g bower 
npm install -g ionic 
npm install -g cordova
ionic2——开发利器之Visual Studio Code 常用插件整理   http://www.cnblogs.com/Ave-Maria/p/6306260.html 

添加android平台环境
ionic cordova platform add android
4)联网安装Appium
进入cmd命令行,输入:
npm install –g appium 或者
npm --registry http://registry.cnpmjs.org 

 install -g appium (推荐这种,npm的国内镜像)
=======================================================================================================
五、创建ionic app
方法一、
上述的工作完成,就可以创建ionic app:
$ ionic start cutePuppyPics--v2如果你想创建Typescript工程,只需要
$ ionic start cutePuppyPics--v2 --typescript
我们可以cd转入cutePuppyPics 目录下执行ionic serve命令:
$ cdcutePuppyPics-app 
$ ionic serve
ju
方法二、
$ionic startcutePuppyPics--v2 --skip-npm
$cnpm install --save
$ionic serve
解释一下上面的语句,--v2表示采用Ionic2版本创建app,--skip-npm表示跳过npm installl package阶段所以这次就不会有那个错误提示,但也没有真的完成创建,我们还需要进入app目录下,执行一次cnpm install --save
,没有报错即说明成功,此时可以使用ionic serve命令,在浏览器上看看我们的app界面效果了
  Ionic start 创建项目报错
   ionic2.0之typescript版的工程搭建
六、安装Android SDK
http://bbs.ionic-china.com/read.php?tid=7&fid=4 

设置环境变量全局访问android我的电脑 - 右键属性 - 高级系统设置 - 环境变量 新建变量名               变量值 ANDROID_HOME     D:\ionic\androidsdk(你sdk的路径)
然后在path里添加(注意前面的分号)   
;%ANDROID_HOME%\platform-tools;%ANDROID_HOME%\tools
执行android -h看到命令即安装设置成功
七、 编译项目APK
编译需要先添加platform平台 ionic platform add android(添加平台ionic platform rm android移除平台 平台大概20M迁移项目时候需要删掉)
ionic build android(第一次编译要下载gradle-2.2.1-all.zip和jar 如果gradle-2.2.1-all.zip下载太慢换个时间段再尝试)
安装插件(开发)
npm install -g node-gyp
安装python  http://jingyan.baidu.com/article/8cdccae97f7d26315413cd88.html 

npm config set python python2.7
 npm/cnpm install -g  node-sass   /cnpm install -g node-sass@3.10.1
set XXX=文件路经--》set SASS_BINARY_PATH=E:\Workspace_2\ionic2\win32-ia32-48_binding.node
查看环境是否合适:echo %SASS_BINARY_PATH%
如果打印出来您配置好的文件地址那就ok了,
最后再来试试安装:npm install -g node-sass
http://jingyan.baidu.com/article/9f63fb919eefcac8400f0e03.html 

http://www.ithao123.cn/content-10727302.html 

八、案例
Ion2--基于ionic2开发的资讯类APP
克隆项目git clone https://github.com/dPary/Ion2.git 

进入项目文件夹cd Ion2
安装依赖包npm install (or cnpm install)
运行调试
ionic serve
九 常用命令: 
npm install -g cnpm --registry=https://registry.npm.taobao.org 

(npm镜像源指向淘宝) 
cnpm install -g cordova ionic(安装cordova ionic) 
cnpm update -g cordova ionic(更新cordova ionic) 
ionic -help(查看帮助) 
ionic -v(查看版本) 
ionic start myApp blank(空项目) 
ionic start myApp tabs(带导航条) 
ionic start myApp sidemenu(带侧滑菜单) 
ionic platform add android(添加android平台) 
ionic platform remove android(移除android平台) 
ionic build android(编译项目apk) 
ionic emulate android(运行项目apk 手机连接在手机运行 模拟器连接在模拟器运行) 
ionic run android (相当于build + emulate) 
ionic run android --prod --release
ionic serve(开启服务调试)