如何使用Hubilder X将vue网页前端项目转成手机app

• 第一步：改一下vue项目中某个路径
• 第二步：将原有vue项目打包生成dist文件夹
• 第三步：新建一个5+ app项目并删除里面自带的不必要文件
• 第四步：配置
• 最后一步：打包

将vue项目中的，config文件夹下index.js文件中的build属性下的assetsPublicPath: '/'改成：assetsPublicPath: ‘https://blog.51cto.com/u_13446/’

将vue项目进行打包，打包完成后会自动生成一个dist文件夹，我们需要的就是这个dist文件夹（后续将此文件夹复制到另外个项目即可）

打包方法：如图

打包完成后：dist文件夹如图

在huilder x中创建5+ app项目，创建完成后可将项目中的“img文件”、“js文件”以及“css”文件删除

创建完成后：

将第一步打包生成的dist文件下面的文件复制到刚刚创建的项目中：

打开创建项目中的manifest.json文件即可进入配置页面

配置的话，不需要改很多，可以把图标配置改一下，也就是生成app的桌面图标（可以使用自动生成图标，上传个图片，后面的图标全部自动上去了，很方便）

如果在后续打包app过程中提示权限问题（比如通讯录权限，需要实名认证才可使用的，如果不需要使用，可以会到权限配置将那个权限取消掉，再继续打包）

将上述步骤完成后就可以进行打包了：单机发行，然后选择：原生app-云打包 即可

生成文件后，在控制台会显示路径，发到手机上就可以真机测试啦，很方便

第一次写博客，哈哈哈哈，记录一下