vue-cli3+cordova实现app混合开发

一、安装vue-cli3

安装并建新项目

注意点:

    1.ios须在装有ios开发环境(就是要装xcode开发工具)的macbook中运行与打包

    2.android须在android sdk (就是要装android studio开发工具) 开发环境(还有java的jdk环境)的电脑中运行与打包


二、进入项目安装cordova

    npm install -g cordova // 尽量不要使用yarn、tyar、cnpm等命令避免意外错误

下载完之后,输入 cordova -v 查看是否成功安装,出现相应的版本号则成功安装。


三、创建cordova

cordova create learn-cordova // 如果发现报错,删除全局npm文件目录中的cordova,然后再npm install -g cordova

然后运行一下代码进行初始化配置

cordova platform add android --save

cordova platform add ios --save

cordova platform add browser --save

vue-cli3+cordova实现app混合开发_第1张图片

四、在根目录上建新vue.config.js,将outpuDir输出路径指定为./www/,因为cordova测试环境是在www文件夹里


vue-cli3+cordova实现app混合开发_第2张图片

五、添加根目录中package.json中的参数


vue-cli3+cordova实现app混合开发_第3张图片

这样每次写完项目后想进行调试,那么就可以将手机链接电脑,然后运行npm run android就可以了

你可能感兴趣的:(vue-cli3+cordova实现app混合开发)