ionic环境搭建

1.jdk环境搭建

    先安装完jdk后，还需要对jdk的环境变量进行配置才能正常使用，下面教大家如何配置jdk环境变量：

1.我的电脑右键选择 计算机→属性→高级系统设置→高级→环境变量






2.系统变量→新建

变量名：JAVA_HOME

变量值：C:\Program Files\Java\ jdk1.7.0_79



3.在系统变量中找到 Path变量，选择编辑

在变量值最后输入：

%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;%SystemRoot%\system32;%SystemRoot%;%SystemRoot%\System32\Wbem;（注意如果原来Path的变量值末尾没有;号，就先输入;号再输入上面的代码）



4.系统变量→新建

变量名：CLASSPATH

变量值：.;%JAVA_HOME%\lib;%JAVA_HOME%\lib\tools.jar（注意最前面有一点）



到这系统变量就配置完毕了。

5.检验jdk是否配置成功：

    运行cmd 输入 java -version （java 和 -version 之间有空格）

2.node.js环境：

         双击node.js文件，安装完成后，在控制台输入 npm –version（环境变量;C:\Program Files\nodejs\ node_modules\npm\bin\，当然会自动产生C:\Program Files\nodejs\、可无需配置）

   




配置node.js环境完成

3.配置安卓环境

         将下载的文件解压到一个不带中文的目录下，直接配置环境变量。

有三个环境变量需要配置

D:\Android\sdk\tools;

D:\Android\sdk\platform-tools;

D:\Android\eclipse\plugins\org.apache.ant_1.8.3.v201301120609\bin

新自己的android sdk到4.4以上版本。不然出错

或者直接下载android-21版本到本地，解压之后直接放置在Android DevelopmentTools解压后文件的sdk\platforms下，最好将原来文件下的东西删掉。

本人采用的是更新SDK，即升级D:\Android\sdk\platforms下的android-18为android-22（即android5.0环境），

后面是采用新的adt（主要是因为编译过程中总是出错）

Path中的环境变量：

;D:\Android\sdk\tools;D:\Android\sdk\platform-tools;D:\Android\eclipse\plugins\org.apache.ant_1.8.3.v201301120609\bin






Ant编译成功

4.安装phonegap和cordova

    在dos命令框中输入：npm install-g phonegap

   Mac使用: sudo npm install -g phonegap



    在dos命令框中输入：npm install-g cordova

    Mac使用: sudo npm install -g cordova

 


如何卸载phonegap以及如何卸载cordova
困扰很多人的一个问题就是 cordova 或者我们的phonegap安装了以后如何去卸载它 其实也很简单,输入下面命令就ok了

npm uninstall cordova -g

npm uninstall phonegap  -g

5.使用下面方式无法成功安装 ionic

     在dos命令框中输入：npm install-g ionic

     Mac使用: sudonpm install -g ionic

这主要在于网络的问题

6.使用这种方式可以成功安装ionic

         npminstall -g cnpm --registry=https://registry.npm.taobao.org

         cnpminstall -g ionic --registry=https://registry.npm.taobao.org

  由于GFW，很多插件下载不下来，我们可以使用淘宝镜像来解决这个问题：

npminstall -g cnpm --registry=https://registry.npm.taobao.org



 安装完成后，以后所有的插件都使用cnpm这个命令来进行安装。

cnpminstall -g ionic --registry=https://registry.npm.taobao.org



安装完成后：输入ionic

7.ionic创建运行项目

主要指令：

ios  创建安装运行

    ionic start ionic_demo01

    cd ionic_demo01

    ionic platform add ios

    ionic build ios

    ionic emulate ios

 

Android  创建安装运行

    ionic start ionic_demo01

    cd ionic_demo01

    ionic platform add android

    ionic build android

    ionic emulate android (模拟器运行)

    ionic run android (连接上手机运行)

    ionic start ionic_demo01






   注意此处要输入n



   cd ionic_demo01

   ionic platform add android



     ionic build android



   ionic run android



浏览器调试:ionic serve

8.Crosswalk

ionic中集成Crosswalk（也可以集成其他的 htnl5框架 ,如 jqmobi ） 介绍：

1．集成 crosswalk

ionicbrowser add crosswalk

2.卸载 crosswalk

ionicbrowser revert android 或者 ionic browser remove crosswalk

http://bbs.phonegap100.com/thread-1446-1-1.html

Cordov中集成 CorssWall(比较复杂,上面方法已经适用于所有应用，自己研究)

http://blog.csdn.net/zapzqc/article/details/41945927