# Phaser 3 with Spine Plugin

**URL:** <https://phaser.discourse.group/t/phaser-3-with-spine-plugin/8608>\
**Category:** Examples\
**Created:** [January 10, 2021, 11:03am UTC](https://phaser.discourse.group/t/phaser-3-with-spine-plugin/8608 "2021-01-10T11:03:16Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [January 10, 2021, 11:03am UTC](https://phaser.discourse.group/t/phaser-3-with-spine-plugin/8608/1 "2021-01-10T11:03:16Z")

</div>

The simplest way to use the Spine Plugin is to include the plugin script in your HTML and then add it as a default scene plugin when configuring the game.

Use `SpinePlugin.js` or an alternative in [phaser/plugins/spine/dist](https://github.com/photonstorm/phaser/tree/master/plugins/spine/dist). Make sure Phaser and the plugin are the same version.

```javascript
<script src="https://cdn.jsdelivr.net/npm/phaser@3.51.0/dist/phaser.js"></script>
<script src="https://cdn.jsdelivr.net/npm/phaser@3.51.0/plugins/spine/dist/SpinePlugin.js"></script>

```

Then use the global `SpinePlugin` to add the plugin to the game.

```javascript
new Phaser.Game({
  plugins: {
    scene: [{ key: "SpinePlugin", plugin: SpinePlugin, mapping: "spine" }],
  },
});

```

https://codepen.io/samme/embed/preview/MWaPrEL?height=300&slug-hash=MWaPrEL&default-tabs=js,result&host=https://codepen.io