Asroads'Blog 君子不器
微信小游戏分包实践
发布于: 2019-07-23 更新于: 2024-11-11 分类于: game 阅读次数: 

随着小游戏开发的日益精进,游戏本身的包体也越来越大,官方开始制定的4M包体,已经开始不能满足要求,微信官方也早早为开发者做了准备,给出了小游戏分包方案,本身分包功能官方文档已经写的很详细,只要照着做,基本都能实现,只是我在Laya2.0的版本实践中,还是遇到了一些坑和一些注意事项。

分包环境

微信 6.6.7 客户端,2.1.0 及以上基础库开始支持,请更新至最新客户端版本,开发者工具请使用 1.02.1806120 及以上版本,可点此下载

分包限制

  • 整个小游戏所有分包大小不超过 8M
  • 单个分包/主包大小不能超过 4M

使用方法

首先我们需要在game.js中配置分包的路径

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
{
"deviceOrientation": "portrait",
"showStatusBar": false,
"networkTimeout": {
"request": 10000,
"connectSocket": 10000,
"uploadFile": 10000,
"downloadFile": 10000
},
"subpackages": [
{
"name": "res",
"root": "subpackage/"
}, {
"name": "subinit",
"root": "subinit.js"
}
]
}

比如我上面配置的路径有两个一个subpackage文件夹 一个是subinit.js,为了方便后期的更新,建议不要过早的把一些功能代码,放到分包下面,这样会造成拓展维护更新带来的很多麻烦。

代码里面我们设置一下分包的路径和名字

1
2
3
4
5
ResManager.ins.subPackage = [
{"name": "res", "root": "subpackage/"},
{"name": "subinit", "root": "subinit.js"}
];
this.loadSubpackages();

loadSubpackages 方法如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
private loadSubpackages() {
let packages = ResManager.ins.subPackage, count: number = 0;
if (!packages.length) {
console.log(JSON.stringify("分包已经加载成功"));
this.bar.changeHandler.clear();
this.event(LoadingView.LOAD_COMPLETE);
return;
}
let url = packages.shift()["name"];
let loadTask = window.platform.ins.loadSubpackage({
name: url, // name 可以填 name 或者 root
success: function (res) {
// 分包加载成功后通过 success 回调
// console.log("loadSubpackage:" + JSON.stringify("success"));
LoadingView.loadSub();
},
fail: function (res) {
// 分包加载失败通过 fail 回调
},
complete: function (res) {
}
});
loadTask.onProgressUpdate((res) => {
console.log('下载进度', res.progress);
// console.log('已经下载的数据长度', res.totalBytesWritten);
// console.log('预期需要下载的数据总长度', res.totalBytesExpectedToWrite)
})
}

老版本兼容

因为分包功能不是所有的微信版本都具有的,所有有需要的,需要做版本兼容

由微信后台编译来处理旧版本客户端的兼容,后台会编译两份代码包,一份是分包后代码,另外一份是整包的兼容代码。对于老客户端,会去下载整包代码启动。

开发者在基础库 2.1.0 以下的版本不需要调用 wx.loadSubpackage 触发加载,2.1.0 以下版本不存在 wx.loadSubpackage 方法。

老版本下,需要开发者调用 require 触发分包入口文件的加载,例如:

1
require('stage1/game.js')

微信 6.6.7 以下客户端开发版/体验版因历史兼容问题无法打开分包小游戏,正式发布版不受影响。如果不打算兼容老版本,开发者可以通过 mp 小程序后台配置端屏蔽 2.1.0 以下基础版的用户。

后记

本身分包没有什么难度,我自己仅仅把一些素材放到了分包下面,但是有些素材我在分包下面后续无法取出,可能是因为后缀名问题(本人猜测),例如我用的laya的粒子配置文件后缀名为.part无法在分包里正常加载和获取。

另外需要注意的是,一旦一个文件夹设置为分包,他的子文件夹或者子文件,不能再次被设置为子包,否则也无法加载成功。

--- 本文结束 The End ---