Ionic移动端开发环境配置

操作系统：Win7

安装Ionic需要npm，所以首先安装nodejs。nodejs官网（https://nodejs.org），一路next安装完成。命令行输入node -v，出现版本号，则安装成功。

接下来配置npm全局模块的存放路径以及cache的路径。新建两个文件夹node_cache，node_global

cmd命令行执行

npm config set prefix "D:\!front\nodejs\node_global"
npm config set cache "D:\!front\nodejs\node_cache"

npm全局模块及cache路径设置完成。

将D:\!front\nodejs\node_global加入系统环境变量path中。

安装cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.org
npm config set registry https://registry.npm.taobao.org

一、安装cordova

cmd命令行输入 npm install -g cordova

npm install -g cordova

-g表示npm全局模块。

cordova -v

显示版本号，则安装成功。

二、安装Ionic

cmd命令行输入 npm install -g ionic

npm install -g ionic

ionic -v

三、开始第一个Ionic App

从ionic自带的demo cutePuppyPics开始。

cmd到工作目录，执行 ionic start cutePuppyPics

选择super，开始下载demo。

安装成功之后，切换到项目目录，启动服务，运行app

cd cutePuppyPics
ionic serve

启动成功，自动跳转到浏览器打开项目。

四、打包android apk

配置android sdk环境变量，新建 ANDROID_HOME ，然后把 %ANDROID_HOME%，%ANDROID_HOME%\platform-tools 添加到 path 中。

1、在Ionic中添加Android平台文件

ionic cordova platform add android

2、编译打包

ionic cordova build android

编译完成后，Apk文件生成在项目目录下的\platforms\android\app\build\outputs\apk\debug下。

Android打包大功告成。

常用命令：

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 serve（开启服务调试）