weixin minigame tutorial
1.0.0
该存储库包含
目前的演示包括以下功能：
├───game.js : main entry point, Phaser. Game main function declared here
├───game.json : minigame configuration
├───images : static assets repository
└───js
├───game
│ ├───managers : each manager is a set of functions
│ │ ├───collisions.js : handles all collision events
│ │ ├───db.js : backend CRUD functions for leaderboard (based on Leancloud API)
│ │ ├───events.js : main events of the game functions
│ │ ├───generators.js : objects generators functions
│ │ ├───leaderboard.js : functions that handle leaderboard and ranking algorithms
│ │ ├───wechat.js : functions that handle WeChat-related API (getting user profile, user friends list etc...)
│ └───objects : Each object is a Class, with its separated file
│ ├───Background
│ ├───Bird
│ ├───Button
│ ├───Floor
│ ├───Pipe
│ ├───objects.js : singleton namespace window.objects where all the game objects live
│ ├───phases.js : different game phases (preload, create, update (called every frame), render (called every frame))
│ └───state.js : singleton namespace window.state where all the game states and parameters live
└───libs
└───lodash-modules
整体架构：和网页游戏差不多
微信小游戏是基于网页技术的，主要使用的语言是Javascript。该系统与网络上的系统类似：画布元素是可访问的，我们可以在每一帧上在其上绘图。我们可以访问WebGL API，从而能够使用GPU使用Shaders（GLSL语言）进行计算。
ctx.fillRect(25, 25, 100, 100);
ctx.clearRect(45, 45, 60, 60);
ctx.strokeRect(50, 50, 50, 50);
但实施上有一些差异
但是，WebGL 和 Canvas API 实现与大多数 Web 浏览器上可以找到的本机 Web 实现不同。小游戏的运行环境在iOS上为JavaScriptCore，在Android上为V8。它们都是没有BOM和DOM的运行环境。没有全局文档，也没有窗口对象。所以，如果你想使用 DOM API 创建 Canvas 和 Image 之类的元素，就会抛出错误。更多关于官方小游戏文档（中文）。
网络库可以适应小游戏环境
为了弥合网页和小游戏之间的差距，微信小游戏团队一直在开发一个特殊的库，weapp-adapter。目标是使网络库与迷你游戏兼容。然而，该库的当前实现仍然不完美且不完整，并且通常需要额外的工作来修复您打算使用的每个第三方库。
许多网页游戏引擎已经被移植（官方和非官方）
| 引擎 | 重点 | 地位 |
|---|---|---|
| 可可 | 基于中文2d UI的网页游戏引擎 | 官方支持 |
| 拉亚 | 中国2D & 3D网页游戏引擎 | 官方支持 |
| 白鹭 | 基于中文2d UI的网页游戏引擎 | 官方支持 |
| 统一 | 3D/2D游戏引擎，行业标准 | 尚不支持 |
| 移相器（网络） | 2D网页游戏引擎，网页游戏行业标准 | 通过非官方端口工作 |
| 三人组 | 3D Web 引擎，行业标准 | 通过非官方端口工作 |
我可以编写自己的迷你游戏吗？是的，您已经可以编写自己的迷你游戏了！您需要的一切，从文档到开发人员工具，都是公开可用的。
还能发布吗？不，它还不能发布，但您仍然可以在手机上预览。 （更多有关 IDE 演示的内容请参见下文）
什么时候发布？我们还不知道。
游戏图形风格：2D 和 3D 均可。
由于可以访问 WebGL，我们还可以显示 3D 游戏，这将由 GPU 加速。
性能：比网页游戏优化稍好的系统
该系统还很年轻，处于 Beta 测试阶段，但我们已经可以看到其性能与网页游戏的性能非常相似。目前，一个好的经验法则是，就限制而言，不要期望超出网页游戏的功能。
规模仍然是主要限制因素。
迷你游戏的最大限制之一来自于它的大小。微信目前只允许下载最大4MB包的游戏。您的游戏可能能够从外部服务器下载额外的资源，但请考虑到每次游戏启动时都必须获取这些资源。因此，游戏在资源方面应该相当轻，3D 游戏应该使用低多边形 3D 对象和低质量纹理。
Web → 小游戏转换：很大程度上取决于底层代码库
可以将网页游戏转换为小游戏。然而，根据所使用的特定库和游戏引擎，该过程可能需要几天到几个月的开发时间。需要事先对游戏源代码进行审核，以估计特定改编需要多长时间。
迷你游戏 → 网页转换：速度很快！
如果使用标准网络游戏框架进行迷你游戏开发，例如 Phaser，您的代码大部分已经与网络兼容，因此无需太多调整即可在浏览器上运行。
IDE和调试工具与小应用程序相同。然而，这些都是纯中文的。调试体验总体上非常好，尽管由于它的年轻性可能会有些问题。
为了清晰起见，整个界面已被翻译成英文。
小游戏的核心兴趣点之一是无缝访问微信平台内嵌入的社交功能，这增加了小游戏的活力和参与率。这里介绍了主要机制以及如何使用它们。
获取当前用户信息
wx.login({
success: function () {
wx.getUserInfo(userInfos)
}
})
您可以获得的其他个人信息：
wx.getLocation() => user location
wx.getWeRunData() => get podometer data from werun
https://mp.weixin.qq.com/debug/wxagame/dev/tutorial/open-ability/authorize.html?t=201832
获取玩过游戏的好友数据列表
wx.getFriendCloudStorage()
获取玩过游戏的群组数据列表
wx.getGroupCloudStorage()
小游戏
Phaser 游戏库
移相器网站
Phaser：创建您的第一个游戏教程
移相器示例
不要相信预览，一定要在真实设备上进行测试。
这是在模拟器上运行但不在真实设备上运行的一段代码的示例：
static preload(game) {
game.load.image('bg', 'js/game/objects/Background/bg.jpg') => working on both emulator + phone
// game.load.image('bg', './js/game/objects/Background/bg.jpg') => working only on emulator
}
限制第三方库的使用，因为通常需要额外的工作
像 lodash 这样的库并不是开箱即用的。您经常需要进入源代码并根据 DOM/BOM API 修改部分才能真正实现加载它们。在Lodash上，你可以通过逐个添加特定模块来解决问题，而不是一次性添加整个库。但这并不总是那么容易！
npm install --save lodash.forEach
NOT
npm install --save lodash
将代码分成较小的文件以使调试更容易
当前 IDE 调试系统的工作方式与 Chrome 和 Firefox 上的对应系统不同。我遇到的最大的挫败感来源之一是，许多问题最终都会抛出非常模糊的、非特定的错误消息，除了失败的文件之外，没有任何关于问题出处的信息。因此，将代码分成更小的块非常重要，因为在没有任何提示的情况下在一千行文件中查找拼写错误比在 50 行文件中查找拼写错误要困难得多。
