Vue Cordova混合app开发打包教程

ionic3是一款非常优秀的混合app开发框架，但是公司以前的项目是Vue写的，有没有一种方法可以把vue开发的项目直接可以打包成app，并且可以让vue调用原生的功能呢？  有的

cordova介绍: 可以把html css js写的代码打包成app，还可以让js调用原生的api

cordova+的开发模式：ionic3（推荐）、cordova+vue、cordova+react 、cordova+angular

Vue+cordova视频教程地址：

https://www.itying.com/goods-937.html

下面我们看看 Cordova把Vue打包成混合app的步骤：

1、需要把Vue打包成浏览器能解析的代码

正式发布vue的项目：（把vue项目打包成浏览器能解析的代码，运行以下命令）


       npm run build   （把vue打包成浏览器能解析的代码）

2、把vue项目用cordova打包成app：


1.  在vue项目中运行  npm run build        （注意：图片 目录的路径 继续往下看）


2、把vue打包后的静态资源复制到cordova项目的www目录里面


3、运行 cordova prepare


4、执行打包操作



按照正常情况上面的vue用cordova打包后是可以运行的，但是注意：


一、如果是       vue init webpack-simple  项目名称      创建的项目：


1、运行npm run build之前需要修改：webpack.config.js里面  publicPath


把publicPath: '/dist/'    改为  publicPath: 'dist/' 



2、修改index里面引入dist的路径  去掉前面的  / (重要)



二、如果是   vue init webpack  项目名称 创建的项目：


运行npm run build之前需要修改：config/index.js 文件 把 assetsPublicPath: '/',   修改成   assetsPublicPath: './',