Phonegap、Cordova、Ionic 开发环境搭建(Windows OS)

一、Java运行环境

--------------------------------------------------------------------------------------------------------------------------------------------

JDK7 官网下载路径： 
http://www.oracle.com/technetwork/java/javase/downloads/jdk7-downloads-1880260.html
JKD8 官网下载路径：
http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
可根据自己的电脑配置下载对应jdk


Jdk安装、环境变量配置
安装后需要配置对应的环境变量
添加 //jdk 安装的根路径
JAVA_HOME  
D:\Java\Jdk\jdk1.7.0_40


PATH
%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;


CLASSPATH
.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar;


// 通过cmd 命令 java -version 验证是否安装配置成功


二、apache-ant 编译器
--------------------------------------------------------------------------------------------------------------------------------------------
apache-ant 下载并安装、配置环境变量
官网下载路径： http://ant.apache.org/bindownload.cgi 


如windows 下载 apache-ant-1.9.6.zip 解压到安装目录即可
添加环境变量：
ANT_HOME
F:\Ionic\apache-ant-1.9.6


CLASSPATH
%ANT_HOME%\bin;


Path
%ANT_HOME%\bin;


// 通过cmd 命令 ant -v 验证是否配置成功


三、Android SDK （Android编译）
--------------------------------------------------------------------------------------------------------------------------------------------
Android官网下载地址：http://developer.android.com/sdk/index.html  // 可能你不能访问该网站 (┬＿┬)


Android developer 最新国内镜像：http://wear.techbrood.com，包含Android最新文档以及Android Wear，Android TV，Android Auto各个子领域方面的内容。

下载下来后需要配置两个环境变量
添加环境变量
ANDROID_HOME
D:\Android\androidsdk

path添加: 
%ANDROID_HOME%\tools;
%ANDROID_HOME%\platform-tools;


四、nodejs  Javascript运行环境、包管理和分发工具
--------------------------------------------------------------------------------------------------------------------------------------------
官网下载路径：
https://nodejs.org/en/download/
可自行根据需要下载
如本机是 win7 x64 下载的是 node-v5.2.0-x64.msi
点击安装到指定目录（有些电脑安装后不能自动配置好环境变量，需要自己配置）


如本人把 nodejs 安装到：F:\Ionic\nodejs 目录下
path环境变量添加：F:\Ionic\nodejs; 


// 通过 cmd命令运行： node -v 验证是否安装成功
新的 nodejs 安装包已经集成了 npm (NodeJS包管理和分发工具) nodejs 安装后可以使用 npm 命令
// 通过 cmd命令运行： npm -v 验证


设置node 安装插件全局目录（如果不设置，npm安装的工具会安装在默认路径下）
npm config set prefix "F:\Ionic\nodejs\node_global" //设置全局目录
npm config set cache "F:\Ionic\nodejs\node_cache" //设置缓存目录


五、Phonegap、Cordova、Ionic安装
--------------------------------------------------------------------------------------------------------------------------------------------
1、 phonegap ：
npm install -g phonegap
如果安装失败，用下面这种方式试试（大多都是网络问题—安装成功请忽略）


//临时使用代理
npm install -g phonegap --registry=http://registry.npmjs.org/
当然也可以把 注册设置到npm配置中:
npm config set registry "http://registry.npmjs.org/"

如果还是安装失败，使用淘宝镜像下载安装（安装成功请忽略）
npm install -g cnpm --registry=http://registry.npm.taobao.org   //设置淘宝镜像
cnpm install -g phonegap     //该方式安装的成功率会高，同样试用于 npm 的其他工具的安装


等待安装成功，输入 phonegap -v 查看是否安装成功，如果提示不是内部或外部命令
配置一下环境变量path添加


PHONEGAP_HOME
F:\Ionic\nodejs\node_global\node_modules\phonegap
Path
%PHONEGAP_HOME%\bin;


2、Cordova ：
npm install -g cordova 
如果安装失败，试试下面这种方式：(临时使用代理)
npm install -g cordova --registry=http://registry.npmjs.org/
如果还是安装失败，使用淘宝镜像下载安装（安装成功请忽略）
cnpm install -g cordova


等待安装成功，输入 cordova -v 查看是否安装成功，如果提示不是内部或外部命令
配置一下环境变量path添加
 
CORDOVA_HOME
F:\Ionic\nodejs\node_global\node_modules\cordova


Path
%CORDOVA_HOME%\bin;


3、ionic ：
npm install -g ionic 
如果安装失败，试试下面这种方式
npm install -g ionic --registry=http://registry.npmjs.org/
或者使用淘宝镜像下载：
npm install -g cnpm --registry=http://registry.npm.taobao.org   //设置淘宝镜像
cnpm install -g ionic     //安装ionic ，该方式安装的成功率会高，同样试用与 npm 的其他工具的安装


等待安装成功，输入 ionic -v 查看是否安装成功，如果提示不是内部或外部命令
配置一下环境变量path添加
IONIC_HOME
F:\Ionic\nodejs\node_global\node_modules\ionic


-- 添加Path
%IONIC_HOME%\bin;


------------------------------------扩展----------------------------------
Chrome扩展， Ripple Emulator。可以直接在Chrome上调试Colrdova的功能
能选择模拟器来测试屏幕大小，还能选择模拟器的Cordova版本

下载地址：
http://ripple.incubator.apache.org
或运行 npm安装
npm install -g ripple-emulator

RIPPLE_HOME
F:\Ionic\nodejs\node_global\node_modules\ripple-emulator

path:
%RIPPLE_HOME%\bin;
----------------------------

建议使用开发工具 WebStorm10