用途:在用户要求创建 Phaser 游戏、初始化 Phaser 4 项目或搭建新游戏时,生成基于 TypeScript 与 Vite 的 Phaser 4(v4.2.1)项目骨架。
主要能力:提供快速脚手架与手动搭建两条路径。快速方式使用官方命令 npm create @phaserjs/game@latest,交互式 CLI 支持 React、Vue、Angular、Svelte、Next.js、SolidJS 和纯 TypeScript,初学者建议选择 TypeScript + Vite;脚手架会自动安装 phaser,随后执行 cd my-game、npm install、npm run dev。手动方式依次执行 mkdir my-game && cd my-game、npm init -y、npm install phaser、npm install -D typescript vite @types/node,并创建 index.html、package.json、tsconfig.json、vite.config.ts、public/assets 目录及 src/main.ts、src/scenes 下的 BootScene、PreloaderScene、GameScene。
配置要点:package.json 脚本为 dev: vite、build: tsc && vite build、preview: vite preview;tsconfig 关键字段包括 target ES2022、lib [ES2022, DOM, DOM.Iterable]、module ESNext、moduleResolution bundler、strict true、skipLibCheck true、noEmit true、types [vite/client],include [src]。Phaser 4 通过 package.json 的 exports map 自带类型,无需额外配置;types: [vite/client] 用于 import.meta.env 类型。不要添加 typeRoots 与 types: ["Phaser"],否则在 4.2.1 下会报 TS2688。
验证:运行 npm run dev,预期在 http://localhost:5173 显示深色画布;若空白页需检查浏览器控制台。
后续与原型:可替换 GameScene.ts 为实际逻辑、向 public/assets 添加资源、设计场景流程,调试完成后设置 arcade: { debug: false }。技能还提供 platformer、topdown、shooter、puzzle、towerdefense、runner、cardgame、fighting、racing 等原型,通过 /phaser-new [template] 或 phaser-coder agent 生成,均使用占位资源以便立即运行。
限制:资源须放在 public/ 下并以相对路径引用,不能通过 import 导入;不要使用 phaser@beta(仍指向 4.0.0-rc.7);黑屏需检查 404 或 JS 错误。具体收费、价格与平台信息暂未提供。