Create PixiJS Extensions
Zyie edited this page Aug 8, 2022
·
5 revisions
As of PixiJS 6.5.0, we have introduced a new extensions
API. This can be used for register plugins like Application, Loader or Renderer plugins. The idea is that each extension to PixiJS has a type (i.e., ExtensionType
) to define where it goes.
Name | Description |
---|---|
Application | Application plugins |
CanvasRendererPlugin | Plugins for CanvasRenderer |
Loader | Plugins to use with Loader (will be deprecated in v7) |
RendererPlugin | Plugins for Renderer |
CacheParser | Parsers for Assets cache (i.e., @pixi/assets ) |
LoadParser | Parsers for Assets loader (i.e., @pixi/assets ) |
ResolveParser | Parsers for Assets resolvers. (i.e., @pixi/assets ) |
Here's an example of simple Renderer plugin.
import { extensions, ExtensionType } from 'pixi.js';
class SayHiPlugin {
static extension = {
type: ExtensionType.RendererPlugin,
name: 'sayHi',
};
speak() {
console.log('Hi!');
}
}
// Alternatively your plugin could be an object, such as with the @pixi/assets parsers
// const SayHiPlugin = {
// extension: {
// type: ExtensionType.RendererPlugin,
// name: 'sayHi',
// },
// speak() {
// console.log('Hi!');
// }
// }
// Make sure to "register" the extension!
extensions.add(SayHiPlugin);
Then when you create a new Renderer, the plugin will be automatically created.
const renderer = new Renderer();
renderer.plugins.sayHi.speak();
Run this code example.
The extensions API also allows for removing extensions. This is useful if you want to remove default plugins or behaviors.
import { extensions, AccessibilityManager } from 'pixi.js';
extensions.remove(AccessibilityManager);