HBuilder将vue项目打包成移动端app

vue项目打包成移动APP

  • 1.首先创建一个vue项目
  • 2.什么都不要管,直接npm run build 打包,打包后之后会有一个dist文件
  • 3 使用HBuilder X 新建一个5+APP
  • 4 除了manifest.json 其他文件全部删除
  • 5然后把打包好的dist文件夹下文件复制到test 下
  • 6 接着修改index.html
    • 这是默认文件
  • 7.云打包 点击云打包
    • 使用公用测试正式 广告全部不要勾选 然后点击打包 打包后之后会返回一个下apk链接 复制链接到浏览器下载 下载后 发给自己手机上 安装就可以了

1.首先创建一个vue项目

HBuilder将vue项目打包成移动端app_第1张图片

2.什么都不要管,直接npm run build 打包,打包后之后会有一个dist文件

HBuilder将vue项目打包成移动端app_第2张图片

3 使用HBuilder X 新建一个5+APP

HBuilder将vue项目打包成移动端app_第3张图片

4 除了manifest.json 其他文件全部删除

HBuilder将vue项目打包成移动端app_第4张图片
在这里插入图片描述

5然后把打包好的dist文件夹下文件复制到test 下

HBuilder将vue项目打包成移动端app_第5张图片

6 接着修改index.html

这是默认文件

HBuilder将vue项目打包成移动端app_第6张图片

在引入文件前面加上 ./
修改后的 每一个都要加上
HBuilder将vue项目打包成移动端app_第7张图片

7.云打包 点击云打包

HBuilder将vue项目打包成移动端app_第8张图片

使用公用测试正式 广告全部不要勾选 然后点击打包 打包后之后会返回一个下apk链接 复制链接到浏览器下载 下载后 发给自己手机上 安装就可以了

HBuilder将vue项目打包成移动端app_第9张图片
HBuilder将vue项目打包成移动端app_第10张图片

下面是效果图(公司的一个项目)
HBuilder将vue项目打包成移动端app_第11张图片

刚好做到这么个项目,百度找了很多 都不行 然后自己结合百度的整合,终于搞好了

你可能感兴趣的:(vue)