vue-phaserjs 4.3.1 → 4.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +29 -25
- package/package.json +7 -7
- package/dist/index.d.ts +0 -11325
- package/dist/index.js +0 -1841
package/README.md
CHANGED
|
@@ -5,14 +5,14 @@
|
|
|
5
5
|
[![NPM downloads][badge-npm-downloads]][url-npm]
|
|
6
6
|
[![NPM Unpacked Size (with version)][badge-npm-unpacked-size]][url-npm]
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
Vue integration for the [Phaser](https://phaser.io) game engine, providing Vue components and composables that bridge Phaser scenes, game objects, and Pinia state with the Vue component lifecycle.
|
|
9
9
|
|
|
10
|
-
|
|
10
|
+
Design notes live in [the specs](https://github.com/Esposter/Esposter/tree/main/openspec/specs/vue-phaserjs).
|
|
11
11
|
|
|
12
12
|
## Table of Contents
|
|
13
13
|
|
|
14
14
|
- 🚀 [Getting Started](#getting-started)
|
|
15
|
-
-
|
|
15
|
+
- 🧩 [Key Exports](#key-exports)
|
|
16
16
|
- ⚖️ [License](#license)
|
|
17
17
|
|
|
18
18
|
---
|
|
@@ -28,36 +28,40 @@ Add the type declaration files so scene key types and custom plugins get proper
|
|
|
28
28
|
- [`phaser.d.ts`](https://github.com/Esposter/Esposter/blob/main/apps/web/app/types/phaser.d.ts) — narrows scene key types
|
|
29
29
|
- [`vue-phaserjs.d.ts`](https://github.com/Esposter/Esposter/blob/main/apps/web/app/types/vue-phaserjs.d.ts) — provides custom plugin types
|
|
30
30
|
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
- TypeScript-first with full generic scene key support
|
|
31
|
+
```vue
|
|
32
|
+
<script setup lang="ts">
|
|
33
|
+
import { Game, Scene, Text } from "vue-phaserjs";
|
|
34
|
+
</script>
|
|
35
|
+
|
|
36
|
+
<template>
|
|
37
|
+
<Game :configuration="{ height: 600, width: 800 }">
|
|
38
|
+
<Scene autoStart sceneKey="menu">
|
|
39
|
+
<Text :configuration="{ style: { fontSize: '32px' }, text: 'Hello', x: 400, y: 300 }" />
|
|
40
|
+
</Scene>
|
|
41
|
+
</Game>
|
|
42
|
+
</template>
|
|
43
|
+
```
|
|
45
44
|
|
|
46
|
-
|
|
45
|
+
See the reference implementation in [the dungeons page](https://github.com/Esposter/Esposter/blob/main/apps/web/app/pages/dungeons.vue) for a complete example of a Phaser game embedded in a Nuxt/Vue page with Pinia-driven state.
|
|
47
46
|
|
|
48
|
-
|
|
47
|
+
## <a name="key-exports">🧩 Key Exports</a>
|
|
49
48
|
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
49
|
+
| Export | Kind | Purpose |
|
|
50
|
+
| ------------------------------------------------------------------------- | ---------- | --------------------------------------------------------------------------------------------------- |
|
|
51
|
+
| `Game` | component | Starts a Phaser game in its element, and renders its slot once the game is ready |
|
|
52
|
+
| `onCreate`, `onInit`, `onNextTick`, `onPreload`, `onShutdown`, `onUpdate` | function | Runs a callback at one stage of a scene's lifecycle, and returns the function that removes it |
|
|
53
|
+
| `Scene` | component | Adds a Phaser scene, starts it when `autoStart` is set, and renders its children while it is active |
|
|
54
|
+
| `Sprite` | component | A sprite drawn in the enclosing scene from its configuration |
|
|
55
|
+
| `useAnimations` | composable | Creates a scene's animation frames, and removes them on shutdown or unmount |
|
|
56
|
+
| `useGame` | composable | The Phaser game in the store, which throws until a Game component has created it |
|
|
57
|
+
| `useTween` | composable | Sets a tween on a ref, which clears the ref when the tween completes |
|
|
56
58
|
|
|
57
59
|
## <a name="license">⚖️ License</a>
|
|
58
60
|
|
|
59
61
|
This project is licensed under the [Apache-2.0 license](https://github.com/Esposter/Esposter/blob/main/LICENSE).
|
|
60
62
|
|
|
63
|
+
Inspired by [phavuer](https://github.com/laineus/phavuer).
|
|
64
|
+
|
|
61
65
|
[badge-license]: https://img.shields.io/github/license/Esposter/Esposter.svg?color=blue
|
|
62
66
|
[url-license]: https://github.com/Esposter/Esposter/blob/main/LICENSE
|
|
63
67
|
[badge-npm-version]: https://img.shields.io/npm/v/vue-phaserjs/latest?color=brightgreen
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "vue-phaserjs",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.4.0",
|
|
4
4
|
"description": "A component library to integrate Phaser Framework with Vue.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"component-library",
|
|
@@ -48,18 +48,18 @@
|
|
|
48
48
|
"lint": "eslint .",
|
|
49
49
|
"lint:fix": "eslint --fix .",
|
|
50
50
|
"test": "vitest",
|
|
51
|
-
"typecheck": "
|
|
51
|
+
"typecheck": "tsrs --fast --runExternalCode"
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
54
|
-
"@esposter/configuration": "4.
|
|
54
|
+
"@esposter/configuration": "4.4.0",
|
|
55
55
|
"@vue/test-utils": "^2.5.1",
|
|
56
|
-
"tsdown": "
|
|
56
|
+
"tsdown": "0.23.2",
|
|
57
57
|
"type-fest": "^5.10.0",
|
|
58
58
|
"vue-tsc": "3.3.11"
|
|
59
59
|
},
|
|
60
60
|
"peerDependencies": {
|
|
61
|
-
"@esposter/shared": "4.
|
|
62
|
-
"parse-tmx": "4.
|
|
61
|
+
"@esposter/shared": "4.4.0",
|
|
62
|
+
"parse-tmx": "4.4.0",
|
|
63
63
|
"phaser": "^4.2.1",
|
|
64
64
|
"phaser4-rex-plugins": "^4.2.0",
|
|
65
65
|
"pinia": "^4.1.0",
|
|
@@ -68,5 +68,5 @@
|
|
|
68
68
|
"inlinedDependencies": {
|
|
69
69
|
"type-fest": "5.10.0"
|
|
70
70
|
},
|
|
71
|
-
"gitHead": "
|
|
71
|
+
"gitHead": "e1a416c4b91da69cc2aa259b50a4d656f204d272"
|
|
72
72
|
}
|