将vue,H5项目打包成app,apk安装包

一.将项目开发完成后

在vue.config.js 文件中添加路径   

publicPath:'./'

将vue,H5项目打包成app,apk安装包_第1张图片

  进行打包  以vscode 开发工具为例  ,按Ctrl+`  (左上角Tab上面) 键 打开终端输入

   npm run build

将vue,H5项目打包成app,apk安装包_第2张图片

二.目录会生成 dist 文件目录,复制dist文件夹所有文件

将vue,H5项目打包成app,apk安装包_第3张图片

三.打开 HBuilder X 开发工具

左上角文件 => 新建 => 项目 => 选择 5+app => 输入项目名称

将vue,H5项目打包成app,apk安装包_第4张图片

四.成功创建项目

将vue,H5项目打包成app,apk安装包_第5张图片

 五.将复制的dist文件夹下的文件直接粘贴,文件直接覆盖。

     找到项目文件  manifest.json   配置 appid , app图标图片,权限

六.找到HBuilder X  工具栏 =>  发行  =>  原生App-云打包  选择公共测试证书

点击右下角打包 

将vue,H5项目打包成app,apk安装包_第6张图片

七. 会显示打包后的apk文件路径  =>    保存到手机安装

将vue,H5项目打包成app,apk安装包_第7张图片

 八.完成

你可能感兴趣的:(webpack,vue,vue.js,前端,npm)