v3-to-v4-migration

Migrate Phaser 3 projects to Phaser 4 with a structured upgrade guide.

40.1k|7.2k|Updated Apr 12, 2013
One-click install
npx skills add https://github.com/phaserjs/phaser --skill v3-to-v4-migration-phaserjs
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: v3-to-v4-migration
Source: https://github.com/phaserjs/phaser/tree/main/skills/v3-to-v4-migration
Command: npx skills add https://github.com/phaserjs/phaser --skill v3-to-v4-migration-phaserjs

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Migrating Phaser 3 projects to Phaser 4, including identifying breaking changes, API differences, and providing structured guidance to upgrade code, assets, and project structure.

Core Features & Use Cases

  • Comprehensive migration overview covering renderer rewrites (pipelines to render nodes), FX/masks to filters, tint system changes, camera matrix updates, texture coordinate conventions, and shader API evolution.
  • Step-by-step migration checklist and practical scenarios such as updating dependencies, refactoring code, and validating behavior across WebGL and Canvas renderers.
  • Guided references to related skills and tutorials to facilitate a smooth upgrade process within the Phaser v4 ecosystem.

Quick Start

Start by auditing your v3 codebase, consult the migration checklist, and implement the recommended changes to upgrade to v4.

Frequently Asked Questions about v3-to-v4-migration

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate my Phaser 3 project to Phaser 4?

To migrate your Phaser 3 project to Phaser 4, audit your existing codebase and follow a structured upgrade guide detailing breaking changes and API migrations. Update dependencies, refactor code, and validate behavior across WebGL and Canvas renderers.

What are the breaking changes in the Phaser v4 renderer?

The Phaser v4 renderer rewrites core areas by transitioning from pipelines to render nodes. The migration also updates FX and masks to filters, modifies the tint system, and changes camera matrix updates and texture coordinate conventions.

How do I update shader APIs when upgrading to Phaser 4?

Updating shader APIs during a Phaser 4 upgrade involves consulting the migration checklist for API evolution details and applying practical examples. The guide provides specific steps to refactor shaders alongside DynamicTexture and RenderTexture updates.

Does migrating Phaser 3 to v4 require updating DynamicTexture and RenderTexture code?

Migrating Phaser 3 to v4 requires updating DynamicTexture and RenderTexture code due to changes in texture coordinate conventions and the shader API. The migration guide provides practical steps and examples to refactor these specific texture components.

What is the best way to test a Phaser game after upgrading to v4?

The best way to test a Phaser game after upgrading to v4 is to validate behavior across both WebGL and Canvas renderers. The migration guide provides testing strategies and a checklist to ensure end-to-end upgrade requirements are satisfied.