Files
engine/docs/zh/platform/wechatMiniGame.mdx
2025-05-22 15:21:28 +08:00

115 lines
6.0 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
---
order: 2
title: 导出到微信小游戏
type: 多平台导出
label: Platform
---
## 平台配置说明
在导出到微信小游戏平台的时候,有以下这些配置项:
<Image src="https://mdn.alipayobjects.com/huamei_w6ifet/afts/img/A*Dc_mQITPRogAAAAAAAAAAAAAejCHAQ/fmt.webp" />
| 配置 | 描述 | 对应到微信小游戏的配置文件 | 对应到微信小游戏中的字段
| ------------- | ------------- | ------------- | --------------------------------------------------------------------------------------------------------------------------------- |
| AppId | 微信小游戏的 AppId必填截图中的 wxdf8199565c509fb9 为测试账号 | project.config.json | appid |
| Orientation | 设置游戏屏幕方向: Landscape横屏、Portrait竖屏| game.json | deviceOrientation |
| Request | wx.request 的超时时间,单位:毫秒 | game.json | networkTimeout.request |
| Connect Socket | wx.connectSocket 的超时时间,单位:毫秒 | game.json | networkTimeout.connectSocket |
| Upload File | wx.uploadFile 的超时时间,单位:毫秒 | game.json | networkTimeout.uploadFile |
| Download File | wx.downloadFile 的超时时间,单位:毫秒 | game.json | networkTimeout.downloadFile |
| Subpackages | 子包列表的配置 | game.json | subpackages |
更多配置详见:[project.config.json](https://developers.weixin.qq.com/minigame/dev/devtools/projectconfig.html)、[game.json](https://developers.weixin.qq.com/minigame/dev/reference/configuration/app.html)
## 导出
选择好微信小游戏平台后,点击导出面板最下方的下载按钮,即可导出所需工程:
<Image src="https://mdn.alipayobjects.com/huamei_w6ifet/afts/img/A*yAeER487lbsAAAAAAAAAAAAAejCHAQ/fmt.webp" />
## 调试
1、从编辑器导出到本地后目录结构如下
<Image src="https://mdn.alipayobjects.com/huamei_w6ifet/afts/img/A*LMWMQpQNdA0AAAAAAAAAAAAAejCHAQ/fmt.webp" style={{zoom: "50%"}} />
**工程目录说明**
|目录或文件|说明|
|-------------|-------------|
|public|资产目录,编辑器所有资产导出到这个目录下,资产的 path 为 /public/xxx|
|scripts|开发者在编辑器中添加的脚本组件,导出到本地后,开发者可以在里面的脚本组件中进行二次开发|
|game.json|对应微信小游戏工程所需要的 [game.json](https://developers.weixin.qq.com/minigame/dev/reference/configuration/app.html)|
|game.ts|入口文件,初始化的逻辑都放在这里|
|package.json|主要存放项目依赖包|
|project.config.json|对应微信小游戏工程所需要的 [project.config.json](https://developers.weixin.qq.com/minigame/dev/devtools/projectconfig.html)|
|project.ts|Galacean 的工程文件,放置初始化相关信息|
2、工程导出到本地后先进入到根目录执行以下命令进行依赖包的安装
```bash
npm i
```
3、本地构建微信小游戏平台所需产物调试阶段可以执行如下命令
```bash
npm run dev
```
执行完这个命令后,会在项目的根目录下生成一个新的目录,这个目录就是微信小游戏所需要的产物,如下:
<Image src="https://mdn.alipayobjects.com/huamei_w6ifet/afts/img/A*wYi0QoS-BUsAAAAAAAAAAAAAejCHAQ/fmt.webp" style={{zoom: "50%"}} />
执行 dev 命令,产物里会有源码的 source map 文件,方便调试,当开发者完成调试准备发包时,可以执行命令:
```bash
npm run release
```
执行这个命令后,相对 dev 产生的产物会去掉 source map 文件,并对代码进行压缩,体积更小,适合发布,如下:
<Image src="https://mdn.alipayobjects.com/huamei_w6ifet/afts/img/A*7mvZR6wwEV4AAAAAAAAAAAAAejCHAQ/fmt.webp" style={{zoom: "50%"}} />
4、打开**微信开发者工具** ,选择小游戏,并导入步骤 3 中生成的目录,如下:
<Image src="https://mdn.alipayobjects.com/huamei_w6ifet/afts/img/A*v-odQJDjcfUAAAAAAAAAAAAAejCHAQ/fmt.webp" />
5、完成步骤 4 后,即可在微信开发者工具中预览最终的结果,如下:
<Image src="https://mdn.alipayobjects.com/huamei_w6ifet/afts/img/A*meRxSLDswlgAAAAAAAAAAAAAejCHAQ/fmt.webp" />
6、在微信开发者工具中的调试详见[微信小游戏调试](https://developers.weixin.qq.com/minigame/dev/guide/runtime/debug/)
## 分包
### 概述
随着小游戏玩法日益丰富,内容增多,包体积变大,影响加载速度。微信小游戏提供分包功能,将游戏内容按规则拆分为主包和子包。主包包含首次启动必要的资源,子包则按需加载,使用户能快速进入游戏。
### Galacean 编辑器分包配置
在 Galacean 编辑器中,文件夹是子包划分的单位。不在子包的内容会进主包。导出小游戏时,在导出面板的子包列表添加子包并关联文件夹即可分包。
### 子包配置步骤
1、打开导出面板选择微信小游戏平台点击子包列表的添加子包按钮添加子包
<Image src="https://mdn.alipayobjects.com/huamei_w6ifet/afts/img/A*j5u6Q7txvj4AAAAAAAAAAAAAejCHAQ/fmt.webp" />
2、在子包中选择需要分包的文件夹即可完成子包的配置
<Image src="https://mdn.alipayobjects.com/huamei_w6ifet/afts/img/A*ndgyR5bjGqsAAAAAAAAAAAAAejCHAQ/fmt.webp" />
### 注意事项
- 设置为子包的文件夹下的脚本资源不会计入子包,会单独导出到主包中
- 微信小游戏中,主包的大小限制为 4M单个子包不限制大小但是整个小游戏的主包+分包大小不超过 30M更详细的规则见[分包](https://developers.weixin.qq.com/minigame/dev/guide/base-ability/subPackage/useSubPackage.html)
- 分包的配置、加载等引擎均帮开发者自动处理好了,开发者动态加载子包下的资产和普通资产是一样的,都是通过 engine.resourceManager.load 来加载
## 发布
本地完成调试后,即可进行发布,具体发布流程详见:[微信小游戏发布](https://developers.weixin.qq.com/minigame/introduction/guide/)