Treeshakeable extensions for any PixiJS Game
npm install gamixi__Treeshakeable extensions for any PixiJS Game__
This Library is in a pre-alpha stage and not ready for production yet.
Help me writing documentation by creating a Pull Request.
I missed a what you should know about ... when starting with PixiJS.
That's why I will share my personal way of doing things with this awesome framework.
You figured out some better ways? Let me and all others know by providing a Pull Request!
When creating Sprites with Aseprite use 240x240px to get a decent looking Button.
That means just export a 120x120px Image with 200% to expect the same results.
According to this #6599 issue you should never use .from() to construct sprites.
Use the PIXI.Loader to preload resources and when this is done, instantiate your sprites with the new keyword.
The static .from() method is able to handle multiple different input types but is therefore not that performant. If you wanna do it the correct way, do it with new.
``javascript
const loader = PIXI.Loader.shared;
loader
.add('button_brown', 'assets/images/button_brown.png')
.add('button_light', 'assets/images/button_light.png')
.load(() => {
const texture = loader.resources['button_brown'].texture;
const sprite = new PIXI.Sprite(texture);
});
`
If you wanna use async / await in your application you have to convert Pixi's callbacks to promises.
You can read here #2538 why Pixi is not using promises in their core library.
`javascript
function load(loader, alias, path) {
return new Promise(
(resolve, reject) => {
loader.add(alias, path).load(() => resolve(loader.resources[path]));
}
);
}
const resource = await load(
PIXI.Loader.shared,
'button_brown',
'assets/images/button_brown.png'
);
// do anything with your loaded texture
``