Hbulid打包vue-cli项目生成APK
之前写过不少移动APP项目,但是平时写的Vue-cli项目都只在浏览器开发运行的,今天稍微写一下使用Hbulid打包Vue-cli项目生成APK的大致流程吧1.准备已有的Vue-cli搭建的webAPP项目确保 npm run dev 命令能正常运行确保项目正常运行、预览、无报错2.修改配置文件的生成路径在项目的config文件夹中找到index.js文件在改文件中找到assetsPublic
·
之前写过不少移动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的制作并且可以下载使用啦
更多推荐
已为社区贡献4条内容
所有评论(0)