cordova打包App

202 阅读4分钟

环境搭建

Node.js

Node.js下载地址:https://nodejs.org/dist/

版本要求:v10.8.0

v10.8.0下载地址:https://nodejs.org/dist/v10.8.0/

版本查看:cmd中输入node -v

> node  -v
v16.11.1

NPM

版本要求:v6.2.0

安装node.js的时候一般会安装npm

版本查看:cmd中输入npm -v

安装指定版本的npm:npm install -g npm@6.2.0

淘宝镜像:npm install -g cnpm --registry=https://registry.npm.taobao.org

查看淘宝镜像版本:cnpm -v

yarn安装:npm install -g yarn

查看yarn版本:yarn -v

> yarn -v
1.22.18

Cordova

版本要求:v10

卸载之前安装的Cordova:npm uninstall cordova -g

安装指定版本的Cordova:npm install cordova@10.0.0

查看Cordova版本: cordova -v

> cordova -v
 

JDK安装

版本要求:1.8

版本查看:cmd中输入java

配置JDK环境变量:

JAVA_HOME
C:\Program Files\Java\jdk1.8.0_201

Gradle

版本要求:V6.7.1

Gradle下载地址:https://gradle.org/releases/

将下载的gradle-6.7.1-all.zip解压到某个目录下,例如:E:\Gradle\gradle-6.7.1

配置Gradle环境变量:

GRADLE_HOME
E:\Gradle\gradle-6.7.1

版本查看:cmd中输入gradle -v

>gradle -v

Android Studio

Android Studio下载安装教程1:https://blog.csdn.net/tao_789456/article/details/118093106

Android Studio下载安装教程2:https://keafmd.blog.csdn.net/article/details/108942788

注意:Android API 30 Android API 28 一定要装 Android API 32 安装的时候默认安装了,可以取消不要了

SDK设置

新建系统环境变量:ANDROID_SDK_ROOT(一定要配置这个名字的系统变量)

ANDROID_SDK_ROOT
E:\SoftwareInstallation\AndroidStudio\SDK(这里是SDK的安装目录,根据你自己的安装目录来)

在Path中添加配置

%ANDROID_SDK_ROOT%\tools
%ANDROID_SDK_ROOT%\platform-tools

如果打包失败

将SDK安装目录\build-tools下的都删了,将30.0.3.zip解压放入到SDK安装目录\build-tools目录中

打包

工作准备

  1. JDK1.8

  2. node V10

  3. cordova V10

  4. androidstudio

  5. gradle V6.7.1

  6. 需要在androidstudio里安装sdk:Android-28、 Android-30

  7. androidSDK需配置环境变量,变量名为ANDROID_SDK_ROOT,jdk、node、gradle都需要配置环境变量

  8. 需要获取前面版本打包使用的key、前端打包文件、图片资源、cordova需要的插件

打包

打包有两种

  1. 通过命令行打包

  2. 通过Android Studio打包

通过命令行打包

所有步骤以xxjapp文件夹为例

  1. 创建cordova工程
  2. 替换前端工程文件
  3. 添加安卓平台
  4. 添加cordova插件
  5. 替换图片资源
  6. 放入签名文件
  7. 编译打包正式版本
  8. 编译打包测试版本
1. 创建cordova工程
# 打开命令行cmd

# 会在当前文件夹下创建名为xxjapp的文件夹
cordova create [文件夹名称] [包名] [app名称]


# 示例

# 会在当前文件夹下创建名为 xxjapp 的文件夹
cordova create xxjapp com.jky.xxjapp 心圩江项目管理平台
cd xxjapp
2. 替换前端工程文件
# 1. 进入到xxjapp文件夹下

# 2. 删除www文件夹下的文件

# 3. 把打包好的前端工程文件放入www文件夹里
3. 添加安卓平台
cordova platform add android --save
4. 添加cordova插件
# cmd命令
cordova plugin add [插件名称]
cordova plugin add cordova-plugin-camera       # 添加相机调用
cordova plugin add cordova-plugin-inappbrowser # 添加内置浏览器
cordova plugin add cordova-plugin-whitelist    # 添加白名单
...  # 添加其他插件
5. 替换图片资源
  • 替换platforms\android\app\src\main\res 里的资源文件

    将资源文件icon中的文件复制粘贴到xxjapp\platforms\android\app\src\main\res,弹窗时选替换

    在打开xxjapp\platforms\android\app\src\main\res\values下的strings.xml

    <?xml version='1.0' encoding='utf-8'?>
    <resources>
        <string name="app_name">心圩江项目管理平台</string>
        <string name="launcher_name">@string/app_name</string>
        <string name="activity_name">@string/launcher_name</string>
    </resources>
    
6. 放入签名文件

Android 签名基础知识_android 代码签名 _lady_zhou的博客-CSDN博客

  • 创建名为key.properties的文件
  • 把签名文件放入platforms\android\app文件夹下
  • 打开key.properties,将key.store的路径改为zy_lisence文件的位置,注意是双 \
# key.properties文件
key.store=C:\\Users\\pjh\\Desktop\\test\\zy_lisence
key.store.password=123456
key.alias=huhu_xxj  
key.alias.password=123456
7. 编译打包正式版本
# 进入 platforms\android\app 目录

xxjapp> cd platforms\android\app


# 在cmd中使用
..\app> gradle assembleRelease -PcdvReleaseSigningPropertiesFile=.\key.properties


# 在Powershell中使用
..\app> gradle assembleRelease -PcdvReleaseSigningPropertiesFile='.\key.properties'

# 或者打开 Android Studio 执行相应gradle命令

在目录xxjapp\platforms\android\app\build\outputs\apk\release 将会输出打包好的apk安装包

8. 编译打包测试版本
xxjapp> cd platforms\android\app
..\app> gradle assembleDebug

# 或者打开 Android Studio 执行相应gradle命令
兼容android 9

打包app android9以上出现http访问限制 在xxjapp\platforms\android\app\src\main\AnroidManifest.xml中的application添加设置项:

添加的代码:android:usesCleartextTraffic="true"

<application android:usesCleartextTraffic="true">
  1. 检查app包名和覆盖安装app的包名是否一致,否则会出现两个同名的app应用
  2. 检查前后打包的key是否相同,否则APP覆盖、调用外部sdk可能会出问题
再次打包时
  • 将新打包好dist的文件复制到xxjapp\platforms\android\app\src\main\assets\www目录下
# 进入 platforms\android\app 目录

xxjapp> cd platforms\android\app


# 在cmd中使用
..\app> gradle assembleRelease -PcdvReleaseSigningPropertiesFile=.\key.properties


# 在Powershell中使用
..\app> gradle assembleRelease -PcdvReleaseSigningPropertiesFile='.\key.properties'

# 或者打开 Android Studio 执行相应gradle命令

在目录xxjapp\platforms\android\app\build\outputs\apk\release将会输出打包好的apk安装包

编译打包测试版本
# 进入 platforms\android\app 目录

xxjapp> cd platforms\android\app

..\app> gradle assembleDebug


# 或者打开androidstudio执行相应gradle命令

在目录xxjapp\platforms\android\app\build\outputs\apk\release将会输出打包好的apk安装包