Phaser-CE 是一个开源的 HTML5 游戏框架，它提供了一系列工具和 API 来方便地创建游戏界面、处理用户输入以及进行游戏物理模拟等操作。在本文中，我们将介绍如何使用 npm 包 phaser-ce 来构建一个简单的 2D 游戏。
安装 Phaser-CE
首先，在你的项目目录中通过以下命令安装 phaser-ce：
--- ------- --------- ------
这个命令会将 phaser-ce 框架安装到你的项目中，并将其添加到 package.json 文件中。
创建游戏对象
在我们开始编写游戏逻辑之前，我们需要先创建一个 Phaser 游戏对象。在你的 index.html 文件中添加以下代码：
--------- -----
------
------
----- ----------------
--------- ------ ------------
-------
------
------- ------------------------------------------------------------
------- ------------------------
-------
-------这段代码中，我们引入了 Phaser 的 JavaScript 库，并在 app.js 文件中编写我们的游戏逻辑。打开 app.js，并添加以下代码：
--- ---- - --- ---------------- ---- ------------ --- - -------- -------- ------- ------- ------- ------ --- -------- --------- - -- ---------------- - -------- -------- - -- --------------- -- --- - -------- -------- - -- ---------------------- -
在这个代码中，我们创建了一个大小为 800 x 600 的自适应游戏窗口，并定义了三个回调函数：preload()、create() 和 update()。分别用于加载游戏资源、创建游戏对象以及更新游戏状态。
加载游戏资源
接下来，我们需要加载一些游戏资源，例如图像和音频文件。在 preload() 函数中添加以下代码：
-------- --------- - ----------------------------- ------------------------- ------------------------- --------------------- ------------------------ -------------------- -
这段代码会通过 game.load API 加载三张图片：背景、玩家和敌人。这些图片应该位于你项目中的 assets 文件夹下。
创建游戏对象
现在，我们已经加载了游戏资源，可以开始创建游戏对象了。在 create() 函数中添加以下代码：
--- -----------
--- -------
--- --------
-------- -------- -
---------- - ------------------ -- --------------
------ - ----------------------------------- ------------------- ----------
------------------------ -----
------- - -----------------
--- ---- - - -- - - --- ---- -
--- ----- - ---------------------------------- ------------------ ------------------- ------------------- ---------
----------------------- -----
-
-这段代码会创建三个游戏对象：背景、玩家和敌人。其中，背景和玩家使用 game.add.sprite() API 创建，而敌人使用 game.add.group() API 创建一个分组，并通过循环为分组中添加 10 个敌人。
更新游戏状态
最后，我们需要在 update() 函数中更新游戏状态，例如移动角色或检测碰撞等。在我们的例子中，我们只需要让所有敌人向玩家移动即可。在 update() 函数中添加以下代码：
-------- -------- ----------------------------------------------------------- ---------- ---------------------------------------------------------------------------------------