Cordova+Vue打包Android Apk

Cordova打包Vue移动端项目Android

环境要求

1. Cordova
2. Gradle
3. Android SDK
4. Java JDK
5. Node.js

安装Cordova

npm install -g cordova

安装Android SDK

下载安装Android SDK installer_r24.4.1-windows.exe,安装你所需要的Android API

配置Android SDK环境变量

ANDROID_HOME:	C:\Users\Gaolei\AppData\Local\Android\android-sdk

安装Gradle

Gradle官网安装下载

下载后解压文件

配置Gradle环境变量

查看已安装Gradle版本

Cordova创建项目

cordova build portal-vue
cordova platform add android --save

查看环境要求是否符合,如下图符合
cordova requirements

构建APP，并运行demo

原始默认生成项目的apk打包

默认效果

接下来的步骤就是将vue项目整合到Cordova项目里面

Vue项目使用Cordova打包

创建一个的Vue项目

在新建的gradle项目portal-vue下新建vue项目vdemo
vue create vdemo

修改配置文件vue.config.js

module.exports = {
     
  publicPath: './',
  outputDir: 'dist',
  assetsDir: 'static'
}

打包vue项目，生成dist目录

将dist目录下文件拷贝到www/路径下，替换原来下面的内容
打包成 Apk文件
cordova build android

浏览器预览:
http://localhost:8000/android/www/index.html
cordova serve android
真机预览直接将打包后的apk文件用安卓手机即可查看效果。


至此，一个简单的Vue项目通过Cordova打包成 Android APK了。

github源码

Duebasslei/cordova-vue-android