Nov 4, 2026

melonJS 为其游戏引擎发布了 25 个 Agent Skill

开源的 2D/3D HTML5 游戏引擎 melonJS 自带 25 个官方 skill,教会 AI Coding Agent 引擎的约定——以及那些不会报错、只会默默出错的坑。

#tutorial#developer-tools#creative

AI 写的游戏有一种恼人的失败模式:代码能跑,游戏却默默出错,不抛任何异常。melonJS 是开源的 2D/3D HTML5 游戏引擎,它自带一组 agent skill,教你的 Coding Agent 引擎的使用约定——更有用的是,教会它那些「不会报错、只会默默出错」的坑。

为什么这个 Skill 重要

melonJS 2 是面向独立开发者的全功能游戏引擎,功能集包括透视与正交相机、GPU 加速的瓦片地图渲染、后处理效果、自定义着色器、3D 网格支持和多边形精确物理,可运行在 WebGPU、WebGL 2 或 Canvas2D 上并自动回退。整个引擎压缩后约 250 KB,零依赖。

这组 skill 随引擎一起版本化,并打包在 npm 包内的 node_modules/melonjs/skills/ 目录里——所以磁盘上永远有一份与你正在运行的版本完全对应的副本。skill 按主题覆盖引擎的各个面,包括 melonjs-getting-started、melonjs-tilemaps、melonjs-physics、melonjs-sprites-and-animation、melonjs-scenes-and-state、melonjs-effects-and-shaders、melonjs-3d 和 melonjs-performance——总共 25 个 skill 目录。

安装

一条命令即可把 skill 装进你项目使用的任意助手:

npx skills add https://github.com/melonjs/melonJS/tree/master/packages/melonjs/skills

安装器会检测项目中存在的助手,把每个 skill 的副本统一安装到 .agents/skills/<skill-name>,再把该副本以符号链接的方式接入每个助手自己的目录——于是 .claude/skills/melonjs 指回 .agents/skills/melonjs,不需要你手动放置任何文件。运行时它会报告所覆盖的助手(撰写本文时为 77 个)。想只装指定的助手,加 -a claude-code -a cursor。

实战:把 skill 接入游戏项目

  1. 在游戏项目根目录执行上面的安装命令。
  2. 查看安装器的报告:它会列出检测到并覆盖的助手;已有的 Claude Code、Cursor 等 agent 从此都能解析 melonjs 的 skill。
  3. 开一个编码会话,用 skill 自己的词汇向 agent 提需求:一个带碰撞形状的瓦片地图场景、一个带移动动画的精灵,或一个跟随玩家的相机。

这组 skill 还附带一份 AGENTS.md,供遵循该约定的工具使用(Codex、Cursor、Gemini CLI);GitHub Copilot 则从 .github/copilot-instructions.md 读取同样的内容。按 README 的说法,它列出了三条「产出能运行但结果是错的代码」的规则,并链接了引擎的 API 索引。如果你已经在维护自己的 AGENTS.md,把这些小节粘贴进去即可。

技巧

  • 安装命令默认从 master 安装。想让 skill 固定在游戏正在运行的发布版本上,把 URL 中的 master 换成对应的 tag。
  • 这些 skill 都是纯 markdown,任何 agent 都能读——你自己也能读。开始会话之前先读一遍,就知道 agent 会遵循哪些引擎约定。
  • skill 没覆盖的内容,引擎在 llms.txt 为 agent 索引了完整 API——每个导出的类、函数和类型都有一行摘要,每次文档构建时重新生成。
  • 由于 npm 包内自带一份副本,离线项目可以直接让 agent 读 node_modules/melonjs/skills/。

何时不用这个 Skill

这组 skill 记录的是一个引擎的约定。如果项目用的是 Phaser、PixiJS 或裸 Canvas,melonjs 的 skill 对你的项目就是错误的指引。而且当你需要覆盖全部细节时,它们是引擎文档与 API 参考的补充,不能取而代之。


查看 排行榜 了解更多 skill。