Hbulid打包vue-cli项目生成APK

之前写过不少移动APP项目，但是平时写的Vue-cli项目都只在浏览器开发运行的，今天稍微写一下使用Hbulid打包Vue-cli项目生成APK的大致流程吧

1.准备已有的Vue-cli搭建的webAPP项目
确保 npm run dev 命令能正常运行

确保项目正常运行、预览、无报错

2.修改配置文件的生成路径
在项目的config文件夹中找到index.js文件

在改文件中找到assetsPublicPath，路径设置为 assetsPublicPath: ‘./’,

3.生成编译后的文件
在命令行执行 npm run dev 命令

可以看到在项目中生成了dist文件夹



4.新生成的文件夹以项目的方式打开
在工具栏中选择文件–打开目录–（选择dist文件夹所在路径）–给项目命名



此时可以看到在工程栏视图如下，此时VueTest文件夹左侧是“W”图标



5.右击工程文件夹–转换成移动APP
此时该工程文件夹的左侧图标变为了“A”，即移动APP项目



6.真机运行或者发行APK
连接手机或者点击模拟器就可以真机运行了

在工具栏选择“发行”–发行为原生安装包



7.APP打包配置
点击发行为原生安装包后（我这里选择Android系统），选择“使用Dcloud公用证书”，点击打包



8.查看打包状态并手动下载APK
点击打包后视图如下



稍等片刻后即可完成APK的制作并且可以下载使用啦