自学内容网 自学内容网

cordova使用vue进行开发

使用vue框架进行cordova跨平台混合框架app开发,步骤如下:

1、使用cordova创建一个项目

2、使用vue创建一个项目

3、在vue项目的根目录创建一个vue.config.js文件(如果有则不用再创建),vue.config.js的内容如下:

'use strict'

module.exports = {
  publicPath: './',
  //这个值也可以被设置为空字符串 ('') 或是相对路径 ('./'),这样所有的资源都会被链接为相对路径,这样打出来的包可以被部署在任意路径,也可以用在类似 Cordova hybrid 应用的文件系统中。
  outputDir: '../www',
  assetsDir:'static',
  indexPath:'index.html',
  runtimeCompiler:false
  //将打包目录指向/cordova-projec下的www
  productionSourceMap: false,
  //如果你不需要生产环境的 source map,可以将其设置为 false 以加速生产环境构建。

}

需要将vue.config.js中的publicPath设置为'./'

然后使用打包命令“npm run build”对vue项目进行打包,打包后会形成一个dist文件,把dist文件夹下的文件全部复制到cordova项目下www目录内(www目录内原文件全部删除)。

4、在cordova项目执行“cordova build android”命令,生成的apk安装包就可以安装到Android手机了。安装完毕,打开,即是vue开发的页面。

参考链接:vue开发Android 安卓 vue 安卓应用


原文地址:https://blog.csdn.net/pbm863521/article/details/140554395

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!