关于jQuery项目或vue项目等前端项目通过HbuilderX打包为app的方法

时间:2024-03-23 07:47:57

今天有朋友问我如何能够通过hbuilder把前端项目打包为app,在此就出一篇详细的文章

这里就假设我们的项目是vue项目

通过项目npm run build 后在项目dist文件夹下的就是经过整合编译的项目文件 同样这是我们接下来打包所需要用到的文件
关于jQuery项目或vue项目等前端项目通过HbuilderX打包为app的方法
接下来我们需要在HbuilderX内新建一个5+app的项目;我们将使用这个新建的项目进行打包操作
关于jQuery项目或vue项目等前端项目通过HbuilderX打包为app的方法
新的5+app项目创建完成之后 删除项目内除了unpackage和manifest.json以外的所有内容
然后把我们的vue项目的dist文件夹下的所有内容复制过来
关于jQuery项目或vue项目等前端项目通过HbuilderX打包为app的方法
接下来我们需要配置一下app的配置文件(就是5+APP项目内的manifest.json文件)
关于jQuery项目或vue项目等前端项目通过HbuilderX打包为app的方法
当然这个需要根据你的app需求来配置(如果只是为了看下效果也可以什么都不改),具体的方法官方也有介绍,我这里就不说太多了

配置完成之后就可以点击菜单栏的 发行 >>> 云打包 来打包app
关于jQuery项目或vue项目等前端项目通过HbuilderX打包为app的方法
关于jQuery项目或vue项目等前端项目通过HbuilderX打包为app的方法
如果你没有android的证书的话可以使用公共证书,当然打ios的包就必须要有证书

说一下这里的打正式包与自定义调试基座的区别,如果你是需要上线就打正式包,如果是开发过程中就打自定义调试基座方便调试应用

打包成功后hbuilderx将会把下载链接返回给你,你的app就可以安装在设备上运行了

当然由于H5部分内容在安卓或ios中的兼容性问题会导致在你的应用安卓/ios上运行时会有问题,这个就需要你自己去处理了。