cordova+vue开发APP

一、安装cordova, 配置环境
npm install -g cordova

自行配置环境,主要是Android SDK

二、创建项目
cordova create help  创建提示
cordova create hello
三、添加平台
cordova platform add android
cordova platform add ios
cordova platform add browser

在浏览器运行

cordova run browser localhost:8000
四、打包
cordova build android

打包成功后的安装包在"platforms/android/app/build/outputs/apk/debug"中

cordova+vue开发APP

创建一个文件夹,在该文件夹下创建上述cordova项目,vue-cli项目与之同级,方便管理。

创建一个基于webpack模板的新项目

vue init webpack my-project
cd my-project

修改vue项目的打包配置文件:
config下的index.js

 build: {
    // Template for index.html
    index: path.resolve(__dirname, '../../hello/www/index.html'),
    assetsRoot: path.resolve(__dirname, '../../hello/www'),
    //hello为cordova项目文件夹名
    assetsSubDirectory: 'static',
    assetsPublicPath: '', //此处修改

build - utils.js

 if (options.extract) {
      return ExtractTextPlugin.extract({
        use: loaders,
        publicPath: '../', //添加此行
        fallback: 'vue-style-loader'
      })
    } else {

将 Vue 项目的打包目录设置到 cordova 项目的 www 文件夹

完成之后,在 vue 目录中运行 npm run build , cordova 项目 www 文件夹下会出现打包出来的 dist 文件夹和 index.html 入口文件。

在 cordova 目录下执行 cordova build 就可以打包出 vue 项目了。

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值