Skip to content

Reducing Bundle Size

Pixi v8 introduced a skipExtensionImports option allows you to opt-out of importing unused extensions. By default, Pixi dynamically imports all extensions during its asynchronous initialization for Application or Renderer. If you set skipExtensionImports to true, these imports will not be loaded and you can selectively import the extensions you need instead.

<script>
// important! you will need to include your
// used extensions manually **before** importing svelte-pixi
import 'pixi.js/app'
import 'pixi.js/text'
// rest of your imports
import { Application, Text } from 'svelte-pixi'
</script>
<Application
width={400}
height={400}
antialias
skipExtensionImports
>
<Text
x={200}
y={200}
text="Hello World"
anchor={0.5}
style={{ fill: 'white' }}
/>
</Application>

Read more from Pixi v8’s migration guide (note manageImports has since been replaced with skipExtensionImports).

Upgrading from v6/v7

If you were using a custom pixi.js file in v6 or v7 you will need to remove it and go back to using pixi.js regularly. Pixi v8 overhauled its package structure and a custom pixi.js file can no longer be built this way. Remove all @pixi/* packages and npm install pixi.js@latest.