vue-phaserjs

packages/vue-phaserjs (npm vue-phaserjs) integrates the Phaser 4 game engine with Vue 3. Instead of imperatively creating and mutating Phaser game objects, you compose a game from Vue components: mount a <Sprite> and a sprite appears in the scene, change a reactive property and the live game object updates, unmount the component and the object is destroyed.

Key concepts

• Game object components — one Vue component per Phaser game object type: <Game>, <Scene>, <Sprite>, <Container>, <Text>, <Tilemap>, <PathFollower>, plus the shape and media set (<Arc>, <Graphics>, <BitmapText>, <RenderTexture>, <Particles>, <Video>, <Polygon>, <Star>, <Ellipse>, <Line>, <Triangle>, <Curve>, <IsoBox>, <IsoTriangle>, and more). Each creates its Phaser object on mount, emits it via @complete for imperative follow-up work, and destroys it on unmount.
• SetterMap / configuration — components take a configuration object; a per-type SetterMap maps each configuration key to the matching Phaser setter, so mutating a reactive configuration property calls the right setter on the live game object. useInitializeGameObject implements this creation → setter-binding → cleanup pipeline for every component.
• Lifecycle hook composables — onInit, onPreload, onCreate, onUpdate, onNextTick, and onShutdown register handlers against the injected scene key, mirroring Phaser's scene lifecycle inside Vue components.
• Pinia stores — usePhaserStore (game instance, scene switching, parallel scenes), useCameraStore (fades), useInputStore (input gating), and useTextStore (default text style). Phaser objects held in stores are wrapped in markRaw so Vue never proxies engine internals.

The library is mature — there is no active roadmap. Ideas for new components or composables were evaluated and settled in rejected (one page per idea); most Phaser primitives that don't map to a Vue component hierarchy are intentionally left as imperative calls on the object received from @complete. The remaining unwrapped game-object types are deferred until a scene needs one.

Shipped

• Game object components — added <Arc>, <Graphics>, <BitmapText>, <RenderTexture>, <Particles>, <Video>, <Polygon>, <Star>, <Ellipse>, <Line>, <Triangle>, <Curve>, <IsoBox>, <IsoTriangle> on top of the existing Sprite/Container/Text/Tilemap/PathFollower/Scene set.
• Testing infrastructure — real headless Phaser (Phaser.HEADLESS) under happy-dom with a canvas stub; lifecycle, component, and store-integration coverage. → testing