cordova打包vue程序

[TOC]

1、安装cordova

平台： Windows10

必需环境: node/ JDK / Adroid SDK / Gradle 不要忘了配置他俩的环境变量

• 全局安装cordova

npm install -g cordova 

1、创建cordova项目，导入vue

• 创建

  cordova create firstApp 

• 添加安卓平台支持

  cordova platform add android

• 查看本工程的依赖项是否安装好 JDK,Android SDK，gradle, android-target

  cordova requirements   

• 导入vue

  1. 为了方便，可以直接修改vue.config.js的打包路径到，cordova项目的www目录下。就好了

  2. vue.config.js 修改outputDir到你自己cordova项目的路径

     module.exports = {
       outputDir: '../cordova/www',  
       publicPath: './',
     

1. 打包后。剩下的，就交给cordova去做了

2、导入各种插件

需要啥插啥

比如 微信的 cordova plugin add cordova-plugin-wechat --variable wechatappid=xxxx

等一系列，可去官网看

3.config.xml的配置

==config.xml==的配置有很多，自行查找，说几个跟打包APK，微信登录相关的

id属性，就是安卓程序包名，将来在微信开发平台上需要用到

<widget id="com.xxxxxxxx.h5app"  ios-CFBundleIdentifier="xxxxx" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name></name>
    <description>
    </description>
    </author>

3、调试与打包成APK

3.1 生成调试的APK

cordova run android

==接下来，你可以选择打包==

打包成未签名的APK

cordova build android --release

造个证书

keytool -genkeypair -alias 别名 -keyalg RSA -validity 20000 -keystore aaaaa.keystore

给apk签名

jarsigner -verbose -keystore aaaaa.keystore -signedjar aaaa.apk aaaa-unsigned.apk 别名

jarsigner -verbose -keystore [签名文件路径] -signedjar [签名后的apk文件路径] [未签名的apk文件路径] [证书别名]

参数说明：
-verbose 签名时输出详细信息，便于查看签名结果
-keystore 指定签名文件的存放路径
-signedjar 指定签名后的apk文件存放路径

签完名，没完，微信登录的话需要去微信开发平台绑定 程序包名，和签名

Android平台
应用下载地址：未填写
应用签名：xxxxxxxxxxxxxxxxxxxxxxxxxxxxx
包名：com.xxxxxxxxxxxxxx.h5app

5、问题汇总

5.1 cordova run android 时候 gradle的报错

FAILURE: Build failed with an exception. 失败:构建失败，并出现异常。

• Where:
  Initialization script 'F:\gradle-7.0\init.d\init.gradle' line: 1
• What went wrong:
  Could not compile initialization script 'F:\gradle-7.0\init.d\init.gradle'.

• startup failed:
  initialization script 'F:\gradle-7.0\init.d\init.gradle': 1: Unexpected input: '{' @ line 1, column 13.

   allprojects {

问题出现的愿意，我在安装并配置gradle的时候，在网上随便找的教程， maven { url 'file:///C:/Java/maven_repository'} 路径这个地方斜杠写成反斜杠了。语法错误编译不过。淦，改了就好了

allprojects {
    repositories {
        maven { url 'file:///C:/Java/maven_repository'}
        mavenLocal()
        maven { name "Alibaba" ; url "https://maven.aliyun.com/repository/public" }
        maven { name "Bstek" ; url "http://nexus.bsdn.org/content/groups/public/" }
        mavenCentral()
    }

    buildscript { 
        repositories { 
            maven { name "Alibaba" ; url 'https://maven.aliyun.com/repository/public' }
            maven { name "Bstek" ; url 'http://nexus.bsdn.org/content/groups/public/' }
            maven { name "M2" ; url 'https://plugins.gradle.org/m2/' }
        }
    }
}

5.2 安卓版本过高，报错 net::ERR_CLEARTEXT_NOT_PERMITTED

• 从Android 9.0（API级别28）开始，默认情况下禁用明文支持。因此http的url均无法在webview中加载，我这里选的是安卓9，API29，所以不能访问。

• 解决办法，修改设置，开启明文支持

  • 文件 platforms\android\app\src\main\AndroidManifest.xml，添加 android:hardwareAccelerated="true"

    <application android:hardwareAccelerated="true">  
    ........................................
    </application>