Cordova + Vue 搭建WebApp(MacOS)

1 篇文章 0 订阅
1 篇文章 0 订阅

1. 安装所需环境

用到的环境包括JDK、node、vue、webpack、npm、cordova、Android(如果运行在安卓平台的话需要安装),关于环境的安装教程很多,也比较简单,这里不再赘述了

2. 创建并编译Cordova项目

创建项目
cordova create hello
进入项目
cd hello
添加运行时平台,这里以Android为例
cordova platform add android
编译项目生成安装包
cordova build

编译的时候可能出现gradle不存在或者platform版本不匹配的问题,对于前者,直接使用brew install gradle安装即可,对于后者,我的解决方案是在Android的SDK Manager中安装相应版本的platform

3. 集成Vue

删除 hello -> www文件夹下的所有文件,以免产生不必要的干扰

在项目目录(即hello文件夹)中,使用 【vue init webpack 项目名】创建Vue项目

更改 项目名 -> config -> index.js 中的配置如下:

此操作的目的是将Vue 发布后的项目直接放在Cordova的www文件夹下,就不必自己再复制过去了

4. 运行

1. 进入 Vue 项目目录,发布项目到 Cordova 项目的 www 文件夹下,即【npm run build】

2. 进入 Cordova 项目目录,对项目进行编译,即【cordova build】

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值