generator-phaser-official-new 是一个基于 Phaser 官方模板的 Yeoman 生成器，它可以快速帮助开发者搭建 Phaser 游戏项目的起始结构。在这篇文章中，我们将会介绍如何使用这个 npm 包来搭建自己的游戏项目，并且掌握一些重要的开发技能。
准备
在开始使用 generator-phaser-official-new 之前，我们需要在本地系统上安装 Node.js 和 npm 包管理器。如果你还没有安装，请先访问官网安装。
安装完成后，我们可以在命令行界面中安装 generator-phaser-official-new npm 包：
npm install -g generator-phaser-official-new
这个命令将会全局安装 generator-phaser-official-new 包，你可以在任意目录下使用它。
创建项目
生成器准备好后，我们可以在命令行中输入以下命令来创建一个新的 Phaser 项目：
yo phaser-official-new
这个命令会引导你完成如何创建项目的过程，包括选择项目名、游戏分辨率、游戏物理引擎等。
完成命令后，generator-phaser-official-new 会自动建立目录、文件，以及在 package.json 中安装所需的依赖。
了解项目结构
生成器建立的项目具有以下结构：
-- -------------------- ---- ------- ------------- --- ------------- --- -------------- --- ---------- --- ----------- --- --------- --- ----------------- --- ------------ --- ------- - --- ------- - --- ---------- - --- --------- --- ---- - --- ------- - - --- -------------- - --- ------- - --- --------- - --- ------- - --- ---------- - --- --------- - --- -------- --- ------------- --- -----------------
- public 目录包含游戏的入口文件 index.html 和 Phaser 引擎。
- src 目录包含项目的所有 TypeScript 文件、资源文件等。
- README.md 文件是项目说明文档，可以直接在你的 GitHub 项目页面显示 Markdown 格式文档内容。
编写自己的代码
现在，我们已经创建好了一个 Phaser 项目，可以开始编写自己的代码了。
创建游戏场景
在 src/scenes 目录下，有一个样例场景 sampleScene.ts，你可以参考它，学习如何创建自己的游戏场景。
Phaser 场景是前端 Web 页面中的一个独立的游戏场景，一个游戏可以拥有多个场景。每个场景都需要进行 preload、create、update 等操作。
-- -------------------- ---- -------
------ ------- ----- ----------- ------- ------------ -
------------- -
------- ---- ------------- ---
-
--------- -
-- ----
-
-------- -
-- -------
-
-------- -
-- --------
-
-应用场景
当你需要使用 generator-phaser-official-new 工具构建你的项目的时候，可以通过以下步骤：
- 安装 Node.js 和 npm 包管理器；
- 安装 generator-phaser-official-new npm 包；
- 使用 Yoeman 工具执行生成器创建命令；
- 等待命令执行完成，即可开始编写游戏代码。
示例代码
最后，我们提供一个示例代码，让你更好的理解 generator-phaser-official-new 的使用方法。
-- -------------------- ---- -------
------ ------ ---- ---------
------ ------- ----- ----------- ------- ------------ -
------------- -
------- ---- ------------- ---
-
--------- -
----------------------------- -------------------------
------------------------------- -------------------- - ----------- ---- ------------ -- ---
-
-------- -
----------------- -- ---------------------------
----- ------ - -------------------- ---- --------- ---
-------------------
------------------------
------------------------ -- -- -
-------------------
---
---------------------- -- -- -
-------------------
---
-
-以上就是 generator-phaser-official-new 的使用教程了。通过使用这个 npm 包，你可以快速创建一个干净整洁的 Phaser 项目结构，让你更加专注于游戏开发。希望我们的介绍对你有帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056cf381e8991b448e6a53