WebApp,BUIApp 结合Dcloud平台(HBuilder) 打包

Web App如何打包?

本文适用于任何的H5打包, 如果你是使用BUI开发的Webapp, 那会更加简单。

最后会有不同平台的打包效果对比, 可以下载安装测试.

BUI Webapp的特点. 想了解更多,可以去BUI官网看.

关于Cordova的打包教程,可以看另外一位群友@伊何底止丶的文章.
Cordova项目中使用BUI框架打包及常见解答

首先你已经创建好一个WebApp工程，下面的只仅仅介绍如何打包：

创建BUI Dcloud 单页工程

buijs create -p dcloud

-p 之后可以加不同平台, 目前有 bingtouch,dcloud,apicloud,appcan, 加上不同平台以后,工程会有对应打包平台需要的文件.

重点：加上不同平台以后,工程会有【对应打包平台】需要的文件

---

压缩混淆工程

npm run build

复制dist目录里面的所有文件

使用Dcloud打包Webapp

新建一个空白应用

打开Hbuilder编辑器

复制的dist工程覆盖空白应用工程

在Dcloud工程上右键粘贴, 选择全覆盖.

在线打包

在工程上右键–>发行–>云打包-打原生安装包

安卓默认使用Dcloud提供的证书测试就可以了,直接点打包就可以排队.

点确定查看打包状态, 稍作等待.

最终效果预览

可通过QQ发送到手机进行安装测试

下载官网demo打包后的预览, 如果是创建的工程,是一个只有简单页面的效果.

物理后退及退出提醒

注意: 如果你要绑定物理后退按键, 在执行 npm run build打包之前,先打开 index.js 里面有个注释, 去掉注释就行(直接下载的demo为webapp,没有这块的处理).

打包平台总结

每个平台的打包方式都是类似,都有自己的对应工具, 只要按这个过程来就可以的.

• Dcloud

  目前免费打包需要排队,功能没有限制,已经很不错 强烈推荐

• APICloud

  免费用户的应用有数量限制,其它整个操作的流程及体验都还可以.

• Appcan

  打包有测试的启动页字样

借鉴地址：webapp结合Dcloud平台打包图文教程