phaser-editor-plugin
Build and extend third-party plugins for Phaser Editor v5 in this template. Use when adding or modifying a plugin feature — a command, custom editor, content type, New File wizard entry, Inspector property section, Outline provider, view, theme, or plugin styles — or when working with plugin.json, the colibri API, the bundled types/*.d.ts, or registerExtensions. Read the docs/ recipes before writing code.
ソース情報
- リポジトリ
- phaserjs/phaser-editor-5-plugin-template
- ソースの最終更新活動
- 2026年6月11日 13:50
- 検出された SKILL.md の言語
- 英語
- スター
- 5
- フォーク
- 0
インストール方法
デフォルトでは、最初にソースを確認する Prompt が選択されています。直接コマンドに切り替えるか、ローカルコピーをダウンロードすることもできます。
ソースファイルを確認
インストールを決める前に、SKILL.md と SkillsMP に表示されている付属ファイルをお読みください。
SKILL.md を表示中
SKILL.md
ソースの指示 · 読み取り専用プレビュー- name
- phaser-editor-plugin
- description
- Build and extend third-party plugins for Phaser Editor v5 in this template. Use when adding or modifying a plugin feature — a command, custom editor, content type, New File wizard entry, Inspector property section, Outline provider, view, theme, or plugin styles — or when working with plugin.json, the colibri API, the bundled types/*.d.ts, or registerExtensions. Read the docs/ recipes before writing code.
# Phaser Editor v5 plugin development
This repository is a template for third-party Phaser Editor v5 plugins. Use this
skill whenever you add or change plugin functionality.
## First: read the right doc
The repo's `docs/` folder is the source of truth for patterns. **Read the
relevant doc before writing code** — don't rely on memory for the colibri API.
1. Orientation: [`AGENTS.md`](../../../AGENTS.md) and
[`docs/architecture.md`](../../../docs/architecture.md).
2. Pick the extension point:
[`docs/extension-points.md`](../../../docs/extension-points.md).
3. Read the matching recipe in `docs/recipes/`:
- [add a command](../../../docs/recipes/add-a-command.md)
- [add a custom editor](../../../docs/recipes/add-a-custom-editor.md)
- [add a content type & New File wizard](../../../docs/recipes/add-a-content-type-and-new-file.md)
- [add Inspector properties](../../../docs/recipes/add-inspector-properties.md)
- [add styles (theme-correct)](../../../docs/recipes/add-styles.md)
## Non-negotiables
- Everything is registered in `registerExtensions(reg)` via
`reg.addExtension(new SomeExtension(...))`. Edit
`myplugin.example/src/ExamplePlugin.ts`.
- One plugin = **one TypeScript namespace**. No `import`/`export` between plugin
files; no bundler; no runtime npm.
- The editor API lives only in `types/colibri.d.ts` and
`types/phasereditor2d.files.d.ts`. **Grep them to confirm any API** — if it
isn't there, it isn't available. Never edit them to make code compile.
- IDs are namespaced: `"<pluginId>.<Name>"`.
- UI must be theme-correct (separate layout from per-theme color; ship light and
dark). Register CSS in `plugin.json` `styles`.
## Workflow
```
- [ ] Read AGENTS.md + the matching docs/recipe
- [ ] Find the closest existing example in myplugin.example/src and copy its shape
- [ ] Confirm API names by grepping types/*.d.ts
- [ ] Add code in src/ (same namespace) and register it in ExamplePlugin.ts
- [ ] npm run build (must pass with no type errors)
```
## Best reference: the working example
`myplugin.example/` is a complete plugin. Mirror its structure:
`ExamplePlugin.ts` (a command + all registrations) and `src/editors/` (a custom
editor with content type, New File wizard, Outline, and Inspector).
GitHubで見る