Ionic + Cordova 跨平台移动开发环境配置

时间:2024-11-07 16:36:20

1、下载安装JDK(根据各自系统选择32位或64位下载),安装完成之后需要做以下环境变量配置

  在“系统变量”中,设置3象属性,JAVA_HOME,PATH,CLASSPATH(大小写无所谓),如果已经存在则点击“编辑”,不存在点击“新建”:

  1)JAVA_HOME

    C:\Program Files\Java\jdk1.7.0_80

    注意:JAVA_HOME指明JDK安装路径,就是用户刚刚安装JDK时选择的路径,此路径中包含lib,bin,jre等文件夹

    Ionic + Cordova 跨平台移动开发环境配置

  2)Path

    %JAVA_HOME%\bin;

    在系统变量Path的值的最前面加入,否则可能在运行时,系统选择部署在前面的jre环境

    注意:Path使得系统可一再任何路径下识别Java命令

    Ionic + Cordova 跨平台移动开发环境配置

  3)CLASSPATH

     .;%JAVA_HOME%\lib

    注意:“."表示当前目录,不能省略

      CLASSPATH为Java加载类(class or lib)路径,只有类在classpath中,java命令才能被识别

    Ionic + Cordova 跨平台移动开发环境配置

  测试:win+R 快捷键(win10右键点击开始,选择“命令提示符(管理员)”),弹出运行窗口,键入”cmd",出现以下画面,键入“Java -version",出现如下信息,证明配置成功:

    Ionic + Cordova 跨平台移动开发环境配置

2、下载Apache Ant 并将其bin目录路径添加进Path路径

       下载完成后解压 ,如存放在C盘 Program Files目录下;

并添加path环境变量(添加方法和java配置path变量是一样的,注意以 ; 隔开每个环境变量的值)

  配置环境变量:我的电脑----属性-----高级----环境变量
        如:ANT_HOME:C:\Program Files\apache-ant-1.9.4\
          PATH:%ANT_HOME%\bin (为了方便在dos环境下操作)

3、 下载Android Studio 

       http://rj.baidu.com/soft/detail/27390.html?ald

1)由于下载Android SDK并非易事,需要配置代理或FQ;

2)在使用中会有各种报错或提示更新sdk等乱七八糟问题,

因此推荐下载Android Studio (百度软件中心下载速度不错),下载后进行安装,会提示选择SDK安装路径,我们主要使用的就是这个SDK。

完成安装后向系统Path环境变量中添加两个值。分别是 Android SDK中tools目录的路径和platform-tools的路径。例如:

C:\Program Files (x86)\Android\android-sdk\tools;
       C:\Program Files (x86)\Android\android-sdk\platform-tools;

4、下载NodeJs并安装

    Ionic + Cordova 跨平台移动开发环境配置

  查看npm信息

    Ionic + Cordova 跨平台移动开发环境配置

5、安装Ionic 和 Cordova

  1)将Ionic和cordova安装到全局环境中(根据网络环境不同,安装时间不确定),使用下面命令:

    npm install -g ionic cordova

  2)创建一个名为 myApp 的 tabs 项目:

    ionic start myApp tabs

  4)添加 Android 平台:  

    cd myApp

    ionic platform add android

  3)编译项目:

    ionic build android

  4)在真机中运行项目:

    ionic run android --device