How to use @pixi/loaders - 10 common examples

// Export deprecations so Rollup can call it
// in the footer after global is defined
// other module must call this manually
import { useDeprecated } from './useDeprecated';

// Install renderer plugins
Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager);
Renderer.registerPlugin('extract', extract.Extract);
Renderer.registerPlugin('interaction', interaction.InteractionManager);
Renderer.registerPlugin('particle', ParticleRenderer);
Renderer.registerPlugin('prepare', prepare.Prepare);
Renderer.registerPlugin('batch', BatchRenderer);
Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer);

Loader.registerPlugin(BitmapFontLoader);
Loader.registerPlugin(SpritesheetLoader);

Application.registerPlugin(TickerPlugin);
Application.registerPlugin(AppLoaderPlugin);

/**
 * String of the current PIXI version.
 *
 * @static
 * @constant
 * @memberof PIXI
 * @name VERSION
 * @type {string}
 */
export const VERSION = '__VERSION__';

/**

import { Loader } from "@pixi/loaders";
import { Filterable } from "./Filterable";
import * as filters from "./filters";
import * as htmlaudio from "./htmlaudio";
import { getInstance, setInstance } from "./instance";
import { SoundLoader } from "./loader";
import { Sound } from "./Sound";
import { SoundLibrary } from "./SoundLibrary";
import { SoundSprite } from "./sprites";
import * as utils from "./utils";
import * as webaudio from "./webaudio";

const sound = setInstance(new SoundLibrary());

// Add the loader plugin
Loader.registerPlugin(SoundLoader);

// Export
Object.defineProperties(sound,
{
    Filterable: { get() { return Filterable; } },
    filters: { get() { return filters; } },
    htmlaudio: { get() { return htmlaudio; } },
    Sound: { get() { return Sound; } },
    SoundLibrary: { get() { return SoundLibrary; } },
    SoundSprite: { get() { return SoundSprite; } },
    utils: { get() { return utils; } },
    webaudio: { get() { return webaudio; } },
    sound: { get() { return sound; } },
});

export default sound;

// Export deprecations so Rollup can call it
// in the footer after global is defined
// other module must call this manually
import { useDeprecated } from './useDeprecated';

// Install renderer plugins
Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager);
Renderer.registerPlugin('extract', extract.Extract);
Renderer.registerPlugin('interaction', interaction.InteractionManager);
Renderer.registerPlugin('particle', ParticleRenderer);
Renderer.registerPlugin('prepare', prepare.Prepare);
Renderer.registerPlugin('batch', BatchRenderer);
Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer);

Loader.registerPlugin(BitmapFontLoader);
Loader.registerPlugin(SpritesheetLoader);

Application.registerPlugin(TickerPlugin);
Application.registerPlugin(AppLoaderPlugin);

/**
 * String of the current PIXI version.
 *
 * @static
 * @constant
 * @memberof PIXI
 * @name VERSION
 * @type {string}
 */
export const VERSION = '__VERSION__';

{
                        bitmapResource.onAfterMiddleware.add(completed);
                    }
                    exists = true;
                    break;
                }
            }

            // texture is not loaded, we'll attempt to add
            // it to the load and add the texture to the list
            if (!exists)
            {
                // Standard loading options for images
                const options = {
                    crossOrigin: resource.crossOrigin,
                    loadType: LoaderResource.LOAD_TYPE.IMAGE,
                    metadata: Object.assign(
                        { pageFile },
                        resource.metadata.imageMetadata
                    ),
                    parentResource: resource,
                };

                this.add(url, options, completed);
            }
        }
    }
}

static use(resource, next)
    {
        // skip if no data or not xml data
        if (!resource.data || resource.type !== LoaderResource.TYPE.XML)
        {
            next();

            return;
        }

        // skip if not bitmap font data, using some silly duck-typing
        if (resource.data.getElementsByTagName('page').length === 0
            || resource.data.getElementsByTagName('info').length === 0
            || resource.data.getElementsByTagName('info')[0].getAttribute('face') === null
        )
        {
            next();

            return;
        }

static use(resource, next)
    {
        const imageResourceName = `${resource.name}_image`;

        // skip if no data, its not json, it isn't spritesheet data, or the image resource already exists
        if (!resource.data
            || resource.type !== LoaderResource.TYPE.JSON
            || !resource.data.frames
            || this.resources[imageResourceName]
        )
        {
            next();

            return;
        }

        const loadOptions = {
            crossOrigin: resource.crossOrigin,
            metadata: resource.metadata.imageMetadata,
            parentResource: resource,
        };

        const resourcePath = SpritesheetLoader.getResourcePath(resource, this.baseUrl);

import * as filters from './filters';
import * as utils from '@pixi/utils';
import { settings } from '@pixi/settings';
import { SpritesheetLoader } from '@pixi/spritesheet';
import { BitmapFontLoader } from '@pixi/text-bitmap';

Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager);
Renderer.registerPlugin('extract', extract.Extract);
Renderer.registerPlugin('graphics', GraphicsRenderer);
Renderer.registerPlugin('interaction', interaction.InteractionManager);
Renderer.registerPlugin('mesh', MeshRenderer);
Renderer.registerPlugin('prepare', prepare.Prepare);
Renderer.registerPlugin('sprite', SpriteRenderer);
Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer);

Loader.registerPlugin(SpritesheetLoader);
Loader.registerPlugin(BitmapFontLoader);

import '@pixi/mixin-cache-as-bitmap';
import '@pixi/mixin-get-child-by-name';
import '@pixi/mixin-get-global-position';
import '@pixi/mixin-app-loader';

utils.mixins.performMixins();

export {
    accessibility,
    extract,
    filters,
    interaction,
    prepare,
    utils,

import * as utils from '@pixi/utils';
import { settings } from '@pixi/settings';
import { SpritesheetLoader } from '@pixi/spritesheet';
import { BitmapFontLoader } from '@pixi/text-bitmap';

Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager);
Renderer.registerPlugin('extract', extract.Extract);
Renderer.registerPlugin('graphics', GraphicsRenderer);
Renderer.registerPlugin('interaction', interaction.InteractionManager);
Renderer.registerPlugin('mesh', MeshRenderer);
Renderer.registerPlugin('prepare', prepare.Prepare);
Renderer.registerPlugin('sprite', SpriteRenderer);
Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer);

Loader.registerPlugin(SpritesheetLoader);
Loader.registerPlugin(BitmapFontLoader);

import '@pixi/mixin-cache-as-bitmap';
import '@pixi/mixin-get-child-by-name';
import '@pixi/mixin-get-global-position';
import '@pixi/mixin-app-loader';

utils.mixins.performMixins();

export {
    accessibility,
    extract,
    filters,
    interaction,
    prepare,
    utils,
    settings,

exts.forEach((ext) => {
                LoaderResource.setExtensionXhrType(ext, LoaderResource.XHR_RESPONSE_TYPE.DEFAULT);
                LoaderResource.setExtensionLoadType(ext, LoaderResource.LOAD_TYPE.AUDIO);
            });
        }

static add()
    {
        LoaderResource.setExtensionXhrType('fnt', LoaderResource.XHR_RESPONSE_TYPE.DOCUMENT);
    }