使用Cordova运行项目到android

Apache Cordova is an open-source mobile development framework. It allows you to use standard web technologies - HTML5, CSS3, and JavaScript for cross-platform development. Applications execute within wrappers targeted to each platform, and rely on standards-compliant API bindings to access each device's capabilities such as sensors, data, network status, etc.

前提：已经安装了Node.js和npm、cnpm （截图不够清晰，所以本文所有的版本号以文字形式展现）

C:\Users\Administrator>node -v
v18.14.0

C:\Users\Administrator>npm -v
9.3.1

Cordova 官网：https://cordova.apache.org/

安装 cordova： npm install -g cordova -g 是全局安装，对node.js版本的要求见 https://cordova.apache.org/docs/en/12.x/guide/cli/installation.html#requirements-and-support

安装完以后检查是否正确安装： cordova -v

C:\Users\Administrator>cordova -v
12.0.0 (cordova-lib@12.0.1)

在android平台使用 Cordova 的系统要求（System Requirements）。官方文档：https://cordova.apache.org/docs/en/12.x/guide/platforms/android/index.html

The Required Software & Tools：

JDK
Gradle
Android Studio
SDK

JDK的安装、配置环境变量

官网下载： https://www.oracle.com/java/technologies/downloads/#jdk22-windows

早期版本可能需要登录账号，新版本不用登录账号，我用的是 21 ：Java Downloads | Oracle 。exe文件下载完成后直接双击安装，可以修改安装路径，安装完成后需要配置环境变量。

配置jdk环境变量教程可看：https://www.runoob.com/w3cnote/windows10-java-setup.html 、 https://www.jianshu.com/p/f4b4c6177046、https://www.liaoxuefeng.com/wiki/1252599548343744/1280507291631649

以win10 + jdk21 为例，按 win+s 然后输入 env，按回车，进入环境变量页面

点击“环境变量”，系统变量

如果是第一次进来，点“新建”，变量名 JAVA_HOME，变量值是你的jdk安装的路径

( 我看很多教程里都要配置CLASSPATH 变量，但 java 9之后应该就不用配置CLASSPATH 了 )

修改PATH：新建两条路径 %JAVA_HOME%\bin %JAVA_HOME%\jre\bin 。java 9之后应该也只需要配 %JAVA_HOME%\bin ，我就只配了这一个。

配置完成后依次点确定，打开cmd，输入 java -version ，出现版本号则配置成功

C:\Users\Administrator>java -version
java version "21.0.1" 2023-10-17 LTS
Java(TM) SE Runtime Environment (build 21.0.1+12-LTS-29)
Java HotSpot(TM) 64-Bit Server VM (build 21.0.1+12-LTS-29, mixed mode, sharing)

Gradle的安装、配置环境变量

官网 https://gradle.org/releases/

直接下载链接 https://gradle.org/next-steps/?version=8.8&format=all

下载完是一个压缩包，放到任意位置解压（我放到了G:\ ）

解压之后配置环境变量。可以直接看教程：https://www.cnblogs.com/leilei0327/p/7054652.html

和jdk一样，进入环境变量|系统变量后，新建 GRADLE_HOME ，输入存放的位置

然后在PATH中新建 %GRADLE_HOME%\bin

配置完成后依次点确定，打开cmd，输入 gradle -v 出现版本号则配置成功

C:\Users\Administrator>gradle -v

------------------------------------------------------------
Gradle 8.8
------------------------------------------------------------

Build time:   2024-05-31 21:46:56 UTC
Revision:     4bd1b3d3fc3f31db5a26eecb416a165b8cc36082

Kotlin:       1.9.22
Groovy:       3.0.21
Ant:          Apache Ant(TM) version 1.10.13 compiled on January 4 2023
JVM:          21.0.1 (Oracle Corporation 21.0.1+12-LTS-29)
OS:           Windows 10 10.0 amd64

Android Studio的安装、配置环境变量

官网：https://developer.android.google.cn/studio?hl=zh-cn 直接下载最新版就行

如果以前安装过 Android Studio，建议卸载并删除原有配置文件。下载完成后双击安装，可以修改安装路径。（这个gif有原来的Android Studio的sdk缓存）

安装完成以后打开Android Studio，根据软件提示一步步安装并设置Android SDK packages.（这个是没有sdk缓存的视频）

SDK的安装、配置环境变量

配置链接：https://cordova.apache.org/docs/en/12.x/guide/platforms/android/index.html#sdk-packages

现在没有单独的SDK下载安装包了，下载包都在Android Studio里。安装sdk分为 5 步：

Installing SDK Platform：第一次安装Android Studio或者卸载干净之后重新安装，会提示必须安装sdk，根据提示安装即可，因为cordova-android@12.0.0, the highest supported SDK is 33.，所以我们要选中 Android13 API Level33
Installing Android SDK Build-Tools： cordova-android@12.0.0, the highest supported SDK is 33.
Installing SDK Command-line Tools (latest)：Check Show Package Details，Expand Android SDK Command-line Tools (latest)，Check Android SDK Command-line Tools (latest)，Click Apply
Installing Android SDK Platform-Tools：默认已安装，没有安装的话按照官方文档安装即可。
Installing Android Emulator：默认已安装，没有安装的话按照官方文档安装即可。

最后配置 ANDROID_HOME 的环境变量，教程：https://www.cnblogs.com/liuyingjie123/p/13938015.html

配置完成后依次点确定，打开cmd，输入 adb version 出现版本号则配置成功。

C:\Users\Administrator>adb version
Android Debug Bridge version 1.0.41
Version 35.0.1-11580240

Cordova 创建并运行Android项目

配置完上述所有环境变量后，我们就可以用Cordova 创建项目并运行了。打开 https://cordova.apache.org/docs/en/12.x/guide/cli/index.html，按照步骤：

在代码目录下输入cmd，然后在控制台输入 cordova create hello com.example.hello HelloWorld
cd hello
cordova platform add android
cordova platform ls
cordova requirements 这时可能会报错
```
Android target: not installed
Command failed with exit code 1: avdmanager list target
```
原因是没有安装模拟器，不用管它（我已经安装了模拟器甚至打开了模拟器，但是检查的时候仍然提醒没有，可能是版本的原因）
Build the App： cordova build （为所有平台build）、 cordova build android （只为Android build）
cordova emulate android
cordova run android
如果有打开的模拟器，就运行到模拟器，如果连接的有真机（打开了usb调试），就运行到真机了。
（也可以把生成的 .apk发送到手机自行安装）

运行成功以后就不用打开Android Studio了，用VScode打开项目即可，修改完以后直接运行 cordova run android ，项目就会自动运行到连接的真机上面：

命令运行记录如下：

Microsoft Windows [版本 10.0.19045.4291]
(c) Microsoft Corporation。保留所有权利。

E:\code_cordova\demo>cordova create hello com.example.hello HelloWorld
Creating a new cordova project.

E:\code_cordova\demo>cd hello

E:\code_cordova\demo\hello>cordova platform add android
Using cordova-fetch for cordova-android
Adding android project...
Creating Cordova project for the Android platform:
        Path: platforms\android
        Package: com.example.hello
        Name: HelloWorld
        Activity: MainActivity
        Android Target SDK: android-34
        Android Compile SDK: 34
Subproject Path: CordovaLib
Subproject Path: app
Android project created with cordova-android@13.0.0

E:\code_cordova\demo\hello>cordova platform ls
Installed platforms:
  android 13.0.0
Available platforms:
  browser
  electron

E:\code_cordova\demo\hello>cordova requirements

Requirements check results for android:
Java JDK: installed 21.0.1
Android SDK: installed true
Android target: not installed
Command failed with exit code 1: avdmanager list target
Exception in thread "main" java.lang.NoClassDefFoundError: javax/xml/bind/annotation/XmlSchema
        at com.android.repository.api.SchemaModule$SchemaModuleVersion.<init>(SchemaModule.java:156)
        at com.android.repository.api.SchemaModule.<init>(SchemaModule.java:75)
        at com.android.sdklib.repository.AndroidSdkHandler.<clinit>(AndroidSdkHandler.java:81)
        at com.android.sdklib.tool.AvdManagerCli.run(AvdManagerCli.java:213)
        at com.android.sdklib.tool.AvdManagerCli.main(AvdManagerCli.java:200)
Caused by: java.lang.ClassNotFoundException: javax.xml.bind.annotation.XmlSchema
        at java.base/jdk.internal.loader.BuiltinClassLoader.loadClass(BuiltinClassLoader.java:641)
        at java.base/jdk.internal.loader.ClassLoaders$AppClassLoader.loadClass(ClassLoaders.java:188)
        at java.base/java.lang.ClassLoader.loadClass(ClassLoader.java:526)
        ... 5 more
Gradle: installed G:\gradle-8.8\bin\gradle.BAT
Some of requirements check failed

E:\code_cordova\demo\hello>cordova build android
Checking Java JDK and Android SDK versions
ANDROID_HOME=G:\Android\Sdk (recommended setting)
ANDROID_SDK_ROOT=undefined (DEPRECATED)
Using Android SDK: G:\Android\Sdk

BUILD SUCCESSFUL in 759ms
1 actionable task: 1 up-to-date
Subproject Path: CordovaLib
Subproject Path: app

BUILD SUCCESSFUL in 1s
50 actionable tasks: 50 up-to-date
Built the following apk(s):
        E:\code_cordova\demo\hello\platforms\android\app\build\outputs\apk\debug\app-debug.apk

E:\code_cordova\demo\hello>cordova emulate android
Checking Java JDK and Android SDK versions
ANDROID_HOME=G:\Android\Sdk (recommended setting)
ANDROID_SDK_ROOT=undefined (DEPRECATED)
Using Android SDK: G:\Android\Sdk

BUILD SUCCESSFUL in 703ms
1 actionable task: 1 up-to-date
Subproject Path: CordovaLib
Subproject Path: app

BUILD SUCCESSFUL in 1s
50 actionable tasks: 50 up-to-date
Built the following apk(s):
        E:\code_cordova\demo\hello\platforms\android\app\build\outputs\apk\debug\app-debug.apk
Checking Java JDK and Android SDK versions
ANDROID_HOME=G:\Android\Sdk (recommended setting)
ANDROID_SDK_ROOT=undefined (DEPRECATED)
Using Android SDK: G:\Android\Sdk
Command failed with exit code 1: apkanalyzer manifest target-sdk E:\code_cordova\demo\hello\platforms\android\app\build\outputs\apk\debug\app-debug.apk
'sh' �����ڲ����ⲿ���Ҳ���ǿ����еĳ���
���������ļ���

E:\code_cordova\demo\hello>cordova run android
Checking Java JDK and Android SDK versions
ANDROID_HOME=G:\Android\Sdk (recommended setting)
ANDROID_SDK_ROOT=undefined (DEPRECATED)
Using Android SDK: G:\Android\Sdk

BUILD SUCCESSFUL in 695ms
1 actionable task: 1 up-to-date
Subproject Path: CordovaLib
Subproject Path: app

BUILD SUCCESSFUL in 1s
50 actionable tasks: 50 up-to-date
Built the following apk(s):
        E:\code_cordova\demo\hello\platforms\android\app\build\outputs\apk\debug\app-debug.apk
Checking Java JDK and Android SDK versions
ANDROID_HOME=G:\Android\Sdk (recommended setting)
ANDROID_SDK_ROOT=undefined (DEPRECATED)
Using Android SDK: G:\Android\Sdk
Deploying to device MO22080402200045
Using apk: E:\code_cordova\demo\hello\platforms\android\app\build\outputs\apk\debug\app-debug.apk
Package name: com.example.hello
INSTALL SUCCESS
LAUNCH SUCCESS

E:\code_cordova\demo\hello>

posted @ 2024-06-11 12:03 sunshine233 阅读(49) 评论(0) 编辑收藏举报

sunshine233