Cordova打包Vue项目成APK——真机调试
CORDOVA
Apache Cordova 是一个开源的移动应用开发框架,允许开发者使用 HTML、CSS 和 JavaScript 构建跨平台移动应用。它通过封装原生功能为 JavaScript API,使 Web 应用能够访问设备硬件(如摄像头、GPS 等)。
核心功能
- 跨平台支持:一次开发,可部署到 iOS、Android、Windows 等平台。
- 插件系统:通过插件扩展原生功能,例如访问文件系统或推送通知。
- 基于 Web 技术:使用前端技术栈(HTML5、CSS、JS)开发,降低学习成本。
安装与配置
npm 全局安装
npm install -g cordova
cordova -version # 查看版本
打包APK
新建Cordova项目
cordova create CordovaDemo
进入CordovaDemo目录
cd CordovaDemo
生成Android平台的Cordova库
cordova platform add android
来生成Android平台的cordova库,这时platforms文件夹中会生成一个android文件夹。
Vue打包
注意:需要先将vue.config.js中publicPath属性改为:”/”
打包项目
npm run build
最后将www文件夹下的所有文件粘贴到Cordova项目中的www文件夹中,如果有重复文件提醒就直接覆盖。
打包APK
cordova requirements # 检查是否缺失环境
在执行这个命令之后,可能会出现很多错误,下面列举几个常见的:
D:\cordova\myApp>cordova requirementsRequirements check results for android:
Java JDK: installed 1.8.0
Android SDK: not installed
Failed to find 'ANDROID_HOME' environment variable. Try setting it manually.
Failed to find 'android' command in your 'PATH'. Try update your 'PATH' to include path to valid SDK directory.
Android target: not installed
Command failed with exit code 1: avdmanager list target
'avdmanager' �����ڲ����ⲿ���Ҳ���ǿ����еij���
�����������
Gradle: not installed
Could not find gradle wrapper within Android SDK. Could not find Android SDK directory.
Might need to install Android SDK or set up 'ANDROID_HOME' env variable.
Some of requirements check failed
很明显,上面显示JDK使用的是1.8,如果没有JDK信息则需要下载对应的JDK然后配置好环境变量
,目前我配置的是17版本。
Android SDK: not installed 没有安装Android的SDK
-
新建目录
C:\Android
-
下载Command Line Tools
https://developer.android.com/studio#command-tools # 选择 Windows zip, 这里网站需要魔法
-
将下载的文件解压到对应目录
C:\Android\cmdline-tools\latest\bin\sdkmanager.bat # latest这个文件夹需要自己去新建
-
装相关的工具包
使用管理员
命令打开 PowerShell 或 CMD# 1. 把命令行工具临时加进 PATH $env:PATH = "$env:PATH;C:\Android\cmdline-tools\latest\bin" # 2. 装平台工具、构建工具、Android 29(Cordova 10/11 默认用 29),安装时一路点击Y sdkmanager "platform-tools" "platforms;android-29" "build-tools;29.0.3"
-
配置环境变量
新建系统环境变量
变量名 值 ANDROID_HOME
C:\Android
ANDROID_SDK_ROOT
同上 C:\Android
(官方推荐同时设)再把工具目录加到
Path
:%ANDROID_HOME%\cmdline-tools\latest\bin %ANDROID_HOME%\platform-tools %ANDROID_HOME%\build-tools\29.0.3
-
验证是否配置成功
android # 应提示已废弃,但能找到 adb version # 能出版本号 sdkmanager --list # 能列出包
这里提示android 不是内部命令是因为Google 早已把 android 命令从 SDK 里删除,你现在用的是新版命令行工具,本来就不该再有 android 这条指令。所以这条报错是正常现象,不是环境没配好。老命令 新命令(新版 SDK 里) android
sdkmanager
android avd
avdmanager
Gradle: not installed 没有安装Gradle
- 装 Gradle(Cordova 9+ 不再自带, 另外 Cordova-Android 11+ 才官方支持 Gradle 8+)
https://gradle.org/releases/ # 选 8.4(兼容 Cordova 10/11)。
- 新建Gradle目录
将下载的gradle解压到新建的 C:\Gradle 文件夹中 - 配置环境变量
把 C:\Gradle\bin 追加到系统 Path。 - 验证
gradle -v
D:\cordova\myApp>cordova requirementsRequirements check results for android:
Java JDK: installed 21.0.8
Android SDK: installed true
Android target: not installed
Please install the Android SDK Platform "platforms;android-35"
Gradle: installed C:\Gradle\gradle-6.9.4\bin\gradle.BAT
Some of requirements check failed
这个错误很明显是没装 Android API 35(即平台镜像),Cordova 检测不到任何“target”。
sdkmanager "platforms;android-35" # 下载平台镜像, 一路 Y
安装完成后进入cordova项目中添加下好的平台
cd D:\cordova\myApp
cordova platform add android@latest
至此所有的配置均已完成!!!
启动USB调试
在手机设置连续点击版本号打开开发者工具——打开USB调试
运行安卓命令
cordova run android # release版本
cordova run android --debug # deubg版本
首次执行会很慢,会自动下载很多包,如果有下面的错误:
D:\cordova\myApp>cordova run android
Checking Java JDK and Android SDK versions
ANDROID_HOME=C:\Android (recommended setting)
ANDROID_SDK_ROOT=C:\Android (DEPRECATED)
Using Android SDK: C:\Android
Subproject Path: CordovaLib
Subproject Path: appFAILURE: Build failed with an exception.* What went wrong:
A problem occurred configuring root project 'HelloCordova'.
> Could not resolve all files for configuration ':classpath'.> Could not download kotlin-compiler-embeddable-1.7.21.jar (org.jetbrains.kotlin:kotlin-compiler-embeddable:1.7.21)> Could not get resource 'https://repo.maven.apache.org/maven2/org/jetbrains/kotlin/kotlin-compiler-embeddable/1.7.21/kotlin-compiler-embeddable-1.7.21.jar '.> Connection reset* Try:
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.
> Run with --scan to get full insights.* Get more help at https://help.gradle.org Deprecated Gradle features were used in this build, making it incompatible with Gradle 8.0.You can use '--warning-mode all' to show the individual deprecation warnings and determine if they come from your own scripts or plugins.See https://docs.gradle.org/7.6/userguide/command_line_interface.html#sec:command_line_warnings BUILD FAILED in 5m 42s
Command failed with exit code 1: D:\cordova\myApp\platforms\android\gradlew -b D:\cordova\myApp\platforms\android\build.gradle cdvBuildDebug
这是 Maven 中央仓库
连接被重置(典型的国内网络不稳定现象),不是版本或脚本错误。
解决办法:
打开Cordova项目的platforms/android/repositories.gradle文件,Ctrl+A全选,然后将下面的代码粘贴即可。
// 国内镜像仓库合集
def repos = {// 1. 阿里云(主镜像)maven { url 'https://maven.aliyun.com/repository/public' }maven { url 'https://maven.aliyun.com/repository/google' }maven { url 'https://maven.aliyun.com/repository/gradle-plugin' }// 2. 腾讯云(备用)maven { url 'https://mirrors.cloud.tencent.com/nexus/repository/maven-public/' }maven { url 'https://mirrors.cloud.tencent.com/nexus/repository/google/' }// 3. 华为云(备用)maven { url 'https://repo.huaweicloud.com/repository/maven/' }// 4. 本地仓库兜底mavenLocal()// 5. 原始中央仓库放最后,防止镜像漏包mavenCentral()google()gradlePluginPortal()
}// 统一供 buildscript 和 allprojects 使用
ext.repos = repos
补充
Android SDK
Android SDK(Software Development Kit)是谷歌提供的用于开发 Android 应用程序的工具集合。它包含开发、测试和调试 Android 应用所需的各种库、工具、文档和示例代码。
Android SDK 的核心组件
Android Studio
官方推荐的集成开发环境(IDE),内置 SDK 管理工具。提供代码编辑、调试、性能分析等功能。
SDK Tools
包括 adb(Android Debug Bridge)、fastboot、emulator 等命令行工具。用于设备连接、系统镜像刷入和模拟器运行。
Platform Tools
版本特定的工具,如 systrace 用于性能分析,与 Android 平台版本绑定。
Build Tools
包含 aapt(Android Asset Packaging Tool)、dx(DEX 编译器)等,用于编译和打包应用。
Android 平台版本
每个 API 级别对应的系统镜像和开发库,例如 android-33 对应 Android 13。
什么是 Gradle
Gradle 是一个开源的构建自动化工具,主要用于 Java、Kotlin 和其他 JVM 语言的项目。它结合了 Apache Ant 的灵活性和 Maven 的依赖管理功能,同时采用基于 Groovy 或 Kotlin 的领域特定语言(DSL)来定义构建脚本。Gradle 支持增量构建,能够显著提高构建效率。
Gradle 的核心特性
基于约定的构建
Gradle 遵循约定优于配置的原则,减少了构建脚本的复杂性。例如,Java 项目默认从 src/main/java
目录加载源代码。
依赖管理
支持从 Maven、Ivy 等仓库自动下载和管理依赖,避免手动管理 JAR 文件。依赖关系通过简洁的 DSL 声明。
多项目构建
支持复杂的多模块项目,允许子项目继承父项目的配置,同时支持自定义每个模块的构建逻辑。
高性能
通过增量构建和任务缓存机制,仅重新编译修改过的部分,大幅减少构建时间。
插件生态系统
提供丰富的官方和社区插件(如 Java、Android、Spring Boot),扩展构建功能。
Gradle 的基本使用
安装 Gradle
- 下载 Gradle 发行版并解压到本地目录。
- 配置环境变量
GRADLE_HOME
指向解压目录,并将$GRADLE_HOME/bin
添加到PATH
。 - 运行
gradle -v
验证安装。
初始化项目
执行 gradle init
命令生成项目骨架。可选择项目类型(Java、Kotlin 等)和构建脚本语言(Groovy 或 Kotlin)。
构建脚本示例
以下是一个简单的 Java 项目 build.gradle.kts
(Kotlin DSL):
plugins {java
}repositories {mavenCentral()
}dependencies {implementation("org.apache.commons:commons-lang3:3.12.0")testImplementation("junit:junit:4.13.2")
}
常用命令
gradle build
:编译代码并运行测试。gradle clean
:删除构建目录。gradle tasks
:列出所有可用任务。
Gradle 与 Maven 的比较
灵活性
Gradle 的 DSL 比 Maven 的 XML 更灵活,支持条件逻辑和自定义任务。
性能
Gradle 的增量构建和缓存机制通常比 Maven 更快,尤其在大型项目中。
依赖管理
两者均支持依赖解析和传递性依赖,但 Gradle 的依赖排除语法更简洁。
学习曲线
Maven 的 XML 配置更易上手,而 Gradle 的 DSL 需要学习 Groovy/Kotlin。
高级功能
自定义任务
在构建脚本中定义新任务,例如复制文件或生成代码:
tasks.register("hello") {doLast {println("Hello, Gradle!")}
}
多项目构建
在 settings.gradle.kts
中声明子项目:
include("app", "lib")
构建缓存
通过 --build-cache
启用缓存,重用其他构建的输出。
依赖版本对齐
使用 platform
统一管理相关库的版本:
dependencies {implementation(platform("org.springframework.boot:spring-boot-dependencies:2.7.0"))
}
常见问题排查
依赖冲突
运行 gradle dependencies
分析依赖树,使用 exclude
移除冲突的库。
构建速度慢
启用并行构建(--parallel
)和按需配置(--configure-on-demand
)。
插件兼容性
检查插件版本是否与 Gradle 版本匹配,参考官方兼容性矩阵。