前言

这是一次利用 Phaser 开发微信小游戏的尝试，并不能算作是教程，也像前一篇一样，还只能算是一篇笔记吧。（本文得到了 @大城小胖 的大力协助）

之前我们使用 three.js 进行了尝试，如果您错过了之前的文章，可以查看前文。

利用 three.js 开发微信小游戏的尝试indienova.com

随着这几天的研究，有了一些新的进展，也尝试了一些新的引擎，发现问题还是蛮多的，不过官方的开发工具一直在更新，相信小游戏的开发环境会越来越完善的。所以建议大家等官方的开发工具和接口完备之后再进行正式开发，目前我们所做的都是一些尝鲜，并且不保证今后也能一定适用。

今天，我们要利用 Phaser 进行一次尝试。Phaser 是一款相当流行的免费开源 HTML 5 游戏框架擎，利用它可以轻松的开发 HTML 5 游戏。在国内也有很多开发者使用，详细的情况除了官网之外，也可以到 Phaser 中文网 站去了解（不过我这个网站应该是爱好者自建的，还是建议直接访问官方英文网站）。

准备工作

开始之前，我们需要准备如下资源：

1. 最新版本的 Phaser CE（社区版）。其实目前最高的版本是即将正式发布的 Phaser 3，但是由于还在开发中，我们这里还是使用最新的 CE 版；
2. 首先应该具有一定的 Phaser 开发经验，至少有所了解；
3. 最新版本的“微信开发者工具”。

另外，我们还需要一个自定义的 weapp-adapter.js，这是使用 wx API 模拟 BOM 和 DOM 的代码组成的库，我们在之前有过介绍（官方介绍），这里就不赘述了。我们会在文章后面的源代码中包含这个做了很多修改（来自 @大城小胖）的 Adapter，所以现在就认为它是基本正常工作的就可以了。

这一次我做了一个简单的示例，HTML 文件也放在源代码中，在页面上跑起来大概是这个样子：

项目结构

跟上一次不同，如果我们直接引入 phaser.min.js 到 main.js 里面：

import * as Phaser from 'libs/phaser.min.js'