ionic教程（2）--2019 win10 ionic项目的打包（详细）

目录

1、安装jdk1.8并配置环境变量

2、安装Gradle

2.1、下载gradle

2.2、配置环境变量

3、安装android studio

3.1、官网下载安装包

3.2、一些关键步骤

4、配置android sdk环境变量

5、打包项目

5.1、创建项目

5.2、启动项目

5.3、添加平台(android/ios)

6、打包

1、报错：Error: Could not find gradle wrapper within Android SDK. Might need to update your Android SDK.

2、报错：

 成功

7、android 调试

---

1、安装jdk1.8并配置环境变量

官网下载sdk，然后配置环境变量，即可

java -v 查看java的版本

这个过程，非常简单就省略了

 

2、安装Gradle

2.1、下载gradle

可以去这个地址:http://services.gradle.org/distributions

找到最新的版本进行安装.

我下的是:gradle-4.1-all.zip

 

2.2、配置环境变量

注意:在安装Gradle之前要先安装JDK,并配好环境变量
 

新建环境变量名GRADLE_HOME,变量值为Gradle的路径

然后将上面的变量名添加到PATH变量中: %GRADLE_HOME%￥bin

注意：￥是中文的\

 

打开cmd,运行: gradle -v 即可

完成

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

2019/01/10补充：

由于我在公司的内网，不能联外网，所以要配置代理。如果能联网就不用配了

 

设置全局代理
在.gradle目录中创建gradle.properties文件，.gradle 目录默认在用户目录下(区别window/linux)； 

比如我的是在 C:\Users\zhangjun.fnst\.gradle

在gradle.properties加入如下内容： 

systemProp.http.proxyHost=10.xxx.219.xxx
systemProp.http.proxyPort=8118
#systemProp.http.proxyUser=userid
#systemProp.http.proxyPassword=password
#systemProp.http.nonProxyHosts=*.nonproxyrepos.com|localhost

systemProp.https.proxyHost=10.xxx.219.xxx
systemProp.https.proxyPort=8118
#systemProp.https.proxyUser=userid
#systemProp.https.proxyPassword=password
#systemProp.https.nonProxyHosts=*.nonproxyrepos.com|localhost

接着设置了环境变量GRADLE_USER_HOME=C:\Users\zhangjun.fnst\.gradle

 

3、安装android studio

3.1、官网下载安装包

              https://developer.android.com/studio/

3.2、一些关键步骤

点击android.exe开始安装

 

注意，由于我是公司内网，所以需要配代理

选择第二的把host port设置一下即可

发现设置完代理，她会帮我自动下android sdk,岂不美滋滋

等待下完即可（趁这个时间，不如喝杯咖啡 ~~）

4、配置android sdk环境变量

找到默认安装sdk的目录

后来我按照官方文档将这4个全部配一下

然后在cmd 输入android，若不报错即可

 

到这里环境基本配置完了，接下来开始打包，我们先来回顾一下之前的项目步骤

5、打包项目

5.1、创建项目

ionic start WxyApp tabs

 引用tabs 模板文件

不用ionic4,用ionic3

 看到这个，就ctrl+c 停止程序，因为我们之前把npm 换成了cnpm

进入刚刚创建的项目，执行cnpm i

5.2、启动项目

ionic serve

5.3、添加平台(android/ios)

cd到当前项目下，执行ionic cordova platform add android

ionic cordova platform add android #添加android平台支持
ionic cordova platform remove android #删除android平台支持

该命令会创建一个platform目录，最后生成的apk是放在该目录下的

可选的平台有很多，常见的 Android、IOS。添加IOS平台需要在MacOS上操作，本文也仅是介绍将ionic项目打包成Android应用，因此不涉及到打包IOS的内容。添加平台通过cordova工具添加，新版本和老版本的命令会有一些区别，以新版本为准

会比较慢请耐心等待

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

后来我发现实在太慢了,而且还有bug

PS F:\demo1\WxyApp> ionic cordova platform add android
> cordova platform add android --save
Adding android project...
Creating Cordova project for the Android platform:
        Path: platforms\android
        Package: io.ionic.starter
        Name: WxyApp
        Activity: MainActivity
        Android target: android-24
Subproject Path: CordovaLib
Android project created with cordova-android@6.0.0
Installing "cordova-plugin-whitelist" for android
ANDROID_HOME=C:\Users\zhangjun.fnst\AppData\Local\Android\Sdk
JAVA_HOME=F:\Program Files\Java\jdk1.8.0_191
Subproject Path: CordovaLib
Downloading http://services.gradle.org/distributions/gradle-2.14.1-all.zip

主要是这行命令太耗时间，可以用其他方法代替吗？

答案是可以的

看到程序运行到这，ctrl+c 终止程序；

 

从http://services.gradle.org/distributions/

下载gradle-2.14.1-all.zip，不用解压

将它复制到指定的目录（注意目录不要弄错）

 修改GradleBuilder.js文件：

 ctrl+s

6、打包

ionic cordova build android

1、报错：Error: Could not find gradle wrapper within Android SDK. Might need to update your Android SDK.

 

1. 如果您在系统中安装了android studio，则从中复制templates文件夹 C:\Program Files\Android\Android Studio\plugins\android\lib\templates
2. 将其粘贴到文件夹中 C:\Users\<user-name>\AppData\Local\Android\sdk\tools
3. 运行命令： ionic build android

            将下载所有必需的jar文件，并生成应用程序的apk文件。

           注意：将环境变量设置为 C:\Users\<user-name>\AppData\Local\Android\sdk\tools。同时将user-name设置为您当前的用户名。

参考：https://stackoverflow.com/questions/42613882/error-could-not-find-gradle-wrapper-within-android-sdk-might-need-to-update-yo

再次执行 ionic cordova build android

2、报错：

* What went wrong:
A problem occurred configuring root project 'android'.
> You have not accepted the license agreements of the following SDK components:
[Android SDK Platform 24].

去android studio下载Android SDK Platform 24即可

 再次执行 ionic cordova build android

 成功

哇，折腾了几天的环境终于配好了 ：}

7、android 调试

首先得有一部android手机，打开手机开发者模式，打开USB连接，与电脑相连

 ionic cordova run  android --prod

 --prod 是加快app的启动速度 ~~

nice ！！！

 

 

参考：

https://cordova.apache.org/docs/en/latest/guide/platforms/android/index.html#adding-sdk-packages

https://ionicframework.com/docs/cli/