vue cordova打包
准备工作：
安装好必要环境: vue-cli，webpack，node.js，android环境 （http://cordova.axuer.com/docs/zh-cn/latest/guide/platforms/android/index.html）；
开始：
注：cordova的项目目录不要有中文，npm的源改为淘宝镜像
第一步：安装cordova
如果已经安装则直接跳过，否则执行以下命令：
npm install -g cordova
第二步：新建cordova项目
分别执行3个命令
cordova create cordovaApp
cd cordovaApp
cordova platform add android
其中：
- cordovaApp： cordova目录名
执行完这3个命令之后，cordova项目就建立好了。
第三步：修改vue项目
本文章不提供vue项目
1.首先修改vue项目的index.html
在body之间加入引入cordova.js
<body> <div id="app"></div> <script type="text/javascript" src="cordova.js"></script> <!-- built files will be auto injected --> </body>
2.修改config文件夹中的index.js文件
修改build中的
assetsSubDirectory: 'static', assetsPublicPath: '/',
为
assetsSubDirectory: '', assetsPublicPath: '',
3.在main.js里面添加（省略这步骤，打包后可能会导致出现空白页）
import VueCorvova from 'vue-cordova'
Vue.use(VueCorvova)当然，vue-cordova需要在vue项目中引入,在vue项目终端执行
npm install vue-cordova --save
测试：
然后在vue项目终端运行
npm run dev
看看是否能够运行起来，如果正常说明到这里是没有问题的（注意这里运行的时候需要将document.addEventListener注释，因为在浏览器环境下是找不到cordova.js的也就不能监听到deviceready的事件，打包在真机上才能实现监听）。
第四步：将vue文件放到cordova项目中并打包（成功后修改，只需反复该步骤即可）
1.先在vue项目中运行
npm run build执行完成后会生成一个dist文件夹，找到这个文件夹将里面的所有文件复制到你的cordova项目的www文件夹下替换它原有的文件。
2.然后在cordova项目终端执行
cordova platform remove android
cordova platform add android
cordova build android会生成一个可执行的apk文件（cordova项目文件\platforms\android\app\build\outputs\apk\debug\app-debug.apk），拷贝到安卓手机安装即可。
添加cordova插件
cordova 5.0+以上的可以直接添加插件
cordova plugin add cordova-hot-code-push-plugin
结果：
或者 通过repo url直接安装（不稳定）
cordova plugin add https://github.com/nordnet/cordova-hot-code-push.git
或者安装本地插件
cordova plugin add E:\project\plugins\cordova-hot-code-push-local-dev-addon
8.查看项目安装的插件
cordova plugin list
开源鸿蒙跨平台开发社区汇聚开发者与厂商，共建“一次开发，多端部署”的开源生态，致力于降低跨端开发门槛，推动万物智联创新。
更多推荐
0
0- 0
已为社区贡献2条内容
所有评论(0)