Windows 下 Ionic 开发环境搭建

Ionic 介绍

首先，Ionic 是什么。

Ionic 是一款基于 Cordova 及 Angular 开发 Hybrid/Web APP 的前端框架，相似的其余框架有：Intel XDK等。

简单来讲就是能够将你的 Web 应用打包发布成 IOS/Android APP，而且提供了 Cordova 以外不少强大的服务和新的特性。

听起来仍是很诱人的，事实上这也是目前最火的一种 Hybrid APP 开发方式。

接下来介绍如何在 Windows 下搭建 Ionic 开发环境。

在开始以前我假设你已经了解了以下概念：

• Java JDK
• Apache Ant
• Android SDK
• NodeJS

以上名词这里就不赘述，若是有不清楚的能够自行查阅

安装步骤

Ionic 官方教程：http://learn.ionicframework.com/videos/windows-android/

如下内容参考官方教程得出：

下载 JDK 并配置好 Java 运行环境

下载地址：http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html（请注意选择您电脑的对应版本）

Java 环境变量的配置：参看：http://zhidao.baidu.com/question/1366931535221381339.html

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

下载地址：http://mirror.tcpdiag.net/apache//ant/binaries/apache-ant-1.9.4-bin.zip

下载完成后解压该文件至某个安全的目录下，而后将改文件夹内的bin文件夹路径添加至系统 Path 环境变量中，如存放在 C 盘 Program Files 目录下则 Path 中添加以下值 C:\Program Files\apache-ant-1.9.4\bin;（添加方法和 java 配置 path 变量是同样的，注意以;隔开每一个环境变量的值）

下载 Android SDK 并配置好 SDK 运行环境

下载地址：http://developer.android.com/sdk/index.html

这里能够只下载 Android SDK 不须要一并下载 Android Studio。

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

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

在这里我发现 Android SDK 安装目录中并无platform-tools这个文件夹，运行 tools 目录下的 android.bat 文件，而后在出现的界面中勾选 Android SDK Platform-tools 而后安装。

注意：这里我下载的纯净版 SDK 以前并无任何 Android 系统在内，因此同 Platform-tools 同样须要在这里勾选须要的版本而后安装。这里至少须要有一个系统，不然没法建立虚拟机。固然，用真机调试的话能够不依赖。

配置 Gradle

下载地址：http://services.gradle.org/distributions/

下载相应版本的 gradle（对应 cordova-android），而后解压放置在某个目录下，而后向系统 Path 环境变量中添加：

• D:\Program Files\gradle\gradle-3.3\bin

下载 Nodejs for Windows 并安装

下载地址：https://nodejs.org/download/

Windows 下安装 Nodejs 环境很简单，在 Nodejs 官网下载正确版本后安装便可。

nmp 安装 Ionic 和 Cordova

完成以上几步须要配置的环境就搭建完成了，接下来就只须要在控制台输入简单的几行命令就能够安装 Ionic 和 Cordova 啦。

进入 cmd 窗口，输入以下指令：

npm install -g cordova ionic

完成以上全部步骤，就能够开始利用 Ionic 快速开发 Android APP 啦

建立并运行 ionic app

建立 APP

进入 cmd 窗口，输入以下指令：

ionic start myapp

这里的 myapp 是你的 APP 的名字

进入建立的 APP 目录

cd myapp

选择配置 Android 环境

ionic platform add android

打包生成 APP

ionic build android

运行 APP

须要先新建虚拟机或者链接手机。

• 新建虚拟机：打开 Android SDK 安装目录下的 AVD Manager.exe 选择新建
• 链接手机：直接经过数据线链接真实设备

ionic run android

到这一步系统就会打开虚拟机或者在真实设备运行简单的示例 APP 了。

其它

--prod 的做用

在编译命令的最后加上 --prod 会让 app 的启动速度加快，但构建速度会变慢。

ionic build android --release --prod

不管是 debug 版本仍是 release 版本都适用。

APP 签名

生成签名文件

生成签名文件须要用到 keytool.exe (位于 jdk1.6.0_24\jre\bin 目录下)，使用产生的 key 对 apk 签名用到的是 jarsigner.exe (位于 jdk1.6.0_24\bin 目录下)，把上两个软件所在的目录添加到环境变量path后，便可使用生成签名文件的命令：

keytool -genkey -v -keystore demo.jks -alias demo -keyalg RSA -keysize 2048 -validity 10000

• -genkey：产生密钥

• -keystore: 签名文件名称（这里是 demo.jks，demo 能够自定义，jks 是 Android studio 生成的签名文件的后缀）

• -alias：签名文件的别名（这里是 demo，可自定义）

• -keyalg：使用 RSA 算法对签名加密（默认 RSA ）

• -validity 有效期限（这里是 10000 天，可自定义）

以上命令在 cmd 运行以下：

自动签名

在工程目录 /platforms/android 目录新建名为 release-signing.properties 的文件，文件内容以下：

storeFile=demo.jks
keyAlias=demo
storePassword=输入的密钥库口令
keyPassword=输入的密钥口令

这样，使用 ionic build android --release编译便可，在 /platforms/android/build/outputs/apk 下就会生成已签名的安装包 android-release.apk

在 windows 下 storeFile 文件路径应使用 Unix 下的目录分隔符 / 。

了解更多可进入 Ionic 官网： http://ionicframework.com/ 进行拓展阅读。