美文网首页程序员
Windows平台上配置ionic项目

Windows平台上配置ionic项目

作者: 阿里高级软件架构师 | 来源:发表于2018-05-02 08:14 被阅读0次

    在Windows下试了试用Ionic开发Android应用,试通了。记录了过程。列在下面,供参考。

    1. JDK

    我用的jdk8,这里下载:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html。我老早下载的,8u66,i586(32位的),现在是8u102:http://download.oracle.com/otn-pub/java/jdk/8u102-b14/jdk-8u102-windows-i586.exe

    安装完毕后要配置环境变量。

    JAVA_HOME
    我安装在这里:C:\Program Files (x86)\Java\jdk1.8.0_66。

    Windows平台上配置ionic项目

    Path
    修改下当前用户的Path,加上%JAVA_HOME%\bin:

    Windows平台上配置ionic项目

    CLASSPATH
    给当前用户下建一个CLASSPATH变量:

    Windows平台上配置ionic项目
    1. Android SDK

    想办法下吧,我是下好的。

    ANDROID_HOME
    新建一个ANDROID_HOME环境变量:

    修改Path
    在Path中添加%ANDROID_HOME%\tools和%ANDROID_HOME%\platform-tools:

    1. Node.js

    我下载的v4.4.7 LTS版本,官网首页有msi包,下载安装即可。链接在这里:https://nodejs.org/dist/v4.4.7/node-v4.4.7-x64.msi

    1. 安装cordova和ionic

    开始菜单,打开Node.js菜单项:

    Windows平台上配置ionic项目

    选择Node.js command prompt,打开后就进入命令行环境了,执行:

    npm install -g cordova ionic
    1
    等待一会儿,cordova和ionic就安装好了:

    Windows平台上配置ionic项目
    1. 创建ionic项目

    找一目录,执行:

    ionic start myApp tabs

    Windows平台上配置ionic项目

    这个命令会创建一个使用tabs模板的应用——myApp。你可以执行下面的命令看看这个应用都可以支持什么平台(其实是cordova支持的平台):

    cordova platforms
    1
    输出类似这样:

    1. 给myApp应用添加android平台

    执行:

    cd myApp
    ionic platform add android

    结果 Windows平台上配置ionic项目

    可能类似下图:

    Windows平台上配置ionic项目
    1. 编译APK

    执行:

    ionic build android
    1
    然后……假如你没有gradle,ionic会帮你下载。如下图:

    Windows平台上配置ionic项目

    过程好漫长的……

    终于解压了:

    Windows平台上配置ionic项目

    不过还要下载maven:

    一通等待……

    哇,经过一个多小时,终于成功了:

    看到那个BUILD SUCCESSFUL就说明成功了。

    1. 真机运行APK

    把安卓手机连接到电脑,执行adb devices看看有没有设备,有的话,执行ionic run android,会自动找到你的手机,把apk安装上去,启动起来。

    下面是相关命令的截图:

    Windows平台上配置ionic项目 Windows平台上配置ionic项目

    下面是真机运行的截图:

    Windows平台上配置ionic项目

    假如你想用模拟器,只要使用AVDManager创建一个,不连接真机的话,ionic run android也可以找到你的模拟器。

    Ok,到这里,环境搭建、示例App构建、真机运行,就Ok了。

    相关文章

      网友评论

        本文标题:Windows平台上配置ionic项目

        本文链接:https://www.haomeiwen.com/subject/ppjqrftx.html