HBuilder打包Vue项目并发布

1.安装HBuilder X

首先访问DCLOUD官网https://www.dcloud.io/下载最新的HBuilder X，这里选择App开发版，下载安装之后，记得注册账号（注意去官网的开发者平台进行实名认证，否则无法进行打包操作），这里后续会使用到。

2.创建5+App项目

点击左上角加号选择项目，在选择5+App，输入你的项目名完成新项目的创建。

​

3.项目运行

首先删除创建项目中的除unpackage和manifest.json的所有文件，然后打包自己的vue项目，生成对应的dist目录，拷贝dist目录的文件到之前创建的项目中。

注意：

a.vue项目的选hash路由，否则会导致网络资源获取不到进入到文件目录。

b.点击index.html看是否能加载出页面，如果不行就是打包的问题，有页面就执行下面的操作。

4.配置manifest.json文件

这边模块配置、权限配置、App常用其他设置选择默认就行了。

5.打包成webApp

a.打包成android apk

点击下载地址，下载android apk安装包

b.打包成IOS ipa

先决条件：

(1) 一台苹果电脑...

(2) 苹果开发者账号（99美元/年），最好使用美国区的Apple ID进行注册，中国区不易申请下来，登录地址https://developer.apple.com/account/。

(3) 生成对应IOS证书和描述文件，具体可以参照本篇文章https://blog.csdn.net/sinat_35861727/article/details/69990790

(4) 苹果软件签证（超级签，贵但更稳定，不那么容易掉签，普通签便宜但容易掉签。）

(5) 软件分发渠道，一般的分发渠道例如蒲公英https://www.pgyer.com/、fir.imhttps://www.betaqr.com/等（免费的有下载次数限制）所以可以选择自己搭建，这样可以免去分发的平台成本。

// appPlist文件用于分发自己的IOS ipa安装包
<?xml version="1.0" encoding="UTF-8"?>  
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">  
<plist version="1.0">  
 <dict>  
 <key>items</key>  
 <array>  
 <dict>  
 <key>assets</key>  
 <array>  
 <dict>  
 <key>kind</key>  
 <string>software-package</string>  
 <key>url</key>  
 <string>https://gitee.com/Magically/appPlist/blob/master/ios.ipa</string>  
 </dict>  
 <dict>  
 <key>kind</key>  
 <string>display-image</string>  
 <key>needs-shine</key>  
 <key>url</key>  
 <string>https://jeepkoss.oss-accelerate.aliyuncs.com/image/20191127/a1a441f2962a4c3ead97e5311476e4b4.png</string>  
 </dict>  
 </array>  
 <key>metadata</key>  
 <dict>  
 <key>bundle-identifier</key>  
 <string>io.dcloud.dogexapp</string>  
 <key>bundle-version</key>  
 <string>1.0.0</string>  
 <key>kind</key>  
 <string>software</string>  
 <key>subtitle</key>  
 <string>Dogex</string>  
 <key>title</key>  
 <string>Dogex</string>  
 </dict>  
 </dict>  
 </array>  
 </dict>  
</plist>

6.总结
以上就是HBuilder X将vue项目打包成webApp的全部内容，具体操作还需要你们自己下来亲自实践一下，毕竟实践才是检验真理的唯一标准，如果有什么问题，欢迎在下方的评论区留言，这边我看到了会统一回复的，最后，感谢您的阅读，喜欢的话点个赞或收藏一下。

7参考文章
https://blog.csdn.net/sinat_35861727/article/details/69990790 // IOS如何生成IOS证书和描述文件