AdvancedAll the active URL parsers that help the parser to extract information and create an asset object-based on parsing the URL itself.
Can be added using the extensions API
resolver.add('foo', [
{
resolution: 2,
format: 'png',
src: 'image@2x.png',
},
{
resolution:1,
format:'png',
src: 'image.png',
},
]);
// With a url parser the information such as resolution and file format could extracted from the url itself:
extensions.add({
extension: ExtensionType.ResolveParser,
test: loadTextures.test, // test if url ends in an image
parse: (value: string) =>
({
resolution: parseFloat(Resolver.RETINA_PREFIX.exec(value)?.[1] ?? '1'),
format: value.split('.').pop(),
src: value,
}),
});
// Now resolution and format can be extracted from the url
resolver.add('foo', [
'image@2x.png',
'image.png',
]);
Set the root path for root-relative URLs. By default the basePath's root is used. If no basePath is set, then the
default value for browsers is window.location.origin
the root path to use
Tells the resolver what keys are associated with witch asset. The most important thing the resolver does
the UnresolvedAsset or array of UnresolvedAssets to add to the resolver
// Single key, single asset:
resolver.add({alias: 'foo', src: 'bar.png');
resolver.resolveUrl('foo') // => 'bar.png'
// Multiple keys, single asset:
resolver.add({alias: ['foo', 'boo'], src: 'bar.png'});
resolver.resolveUrl('foo') // => 'bar.png'
resolver.resolveUrl('boo') // => 'bar.png'
// Multiple keys, multiple assets:
resolver.add({alias: ['foo', 'boo'], src: ['bar.png', 'bar.webp']});
resolver.resolveUrl('foo') // => 'bar.png'
// Add custom data attached to the resolver
Resolver.add({
alias: 'bunnyBooBooSmooth',
src: 'bunny{png,webp}',
data: { scaleMode:SCALE_MODES.NEAREST }, // Base texture options
});
resolver.resolve('bunnyBooBooSmooth') // => { src: 'bunny.png', data: { scaleMode: SCALE_MODES.NEAREST } }
This adds a bundle of assets in one go so that you can resolve them as a group. For example you could add a bundle for each screen in you pixi app
The id of the bundle to add
A record of the asset or assets that will be chosen from when loading via the specified key
resolver.addBundle('animals', [
{ alias: 'bunny', src: 'bunny.png' },
{ alias: 'chicken', src: 'chicken.png' },
{ alias: 'thumper', src: 'thumper.png' },
]);
// or
resolver.addBundle('animals', {
bunny: 'bunny.png',
chicken: 'chicken.png',
thumper: 'thumper.png',
});
const resolvedAssets = await resolver.resolveBundle('animals');
Add a manifest to the asset resolver. This is a nice way to add all the asset information in one go. generally a manifest would be built using a tool.
the manifest to add to the resolver
Returns the aliases for a given asset
the asset to get the aliases for
Checks if a bundle with the given key exists in the resolver
The key of the bundle
Checks if an asset with a given key exists in the resolver
The key of the asset
Let the resolver know which assets you prefer to use when resolving assets. Multiple prefer user defined rules can be added.
the prefer options
resolver.prefer({
// first look for something with the correct format, and then then correct resolution
priority: ['format', 'resolution'],
params:{
format:'webp', // prefer webp images
resolution: 2, // prefer a resolution of 2
}
})
resolver.add('foo', ['bar@2x.webp', 'bar@2x.png', 'bar.webp', 'bar.png']);
resolver.resolveUrl('foo') // => 'bar@2x.webp'
Used for testing, this resets the resolver to its initial state
Resolves each key in the list to an asset object.
Another key function of the resolver! After adding all the various key/asset pairs. this will run the logic
of finding which asset to return based on any preferences set using the prefer function
by default the same key passed in will be returned if nothing is matched by the resolver.
key or keys to resolve
Resolves each key in the list to an asset object.
Another key function of the resolver! After adding all the various key/asset pairs. this will run the logic
of finding which asset to return based on any preferences set using the prefer function
by default the same key passed in will be returned if nothing is matched by the resolver.
key or keys to resolve
If the resolver has had a manifest set via setManifest, this will return the assets urls for a given bundleId or bundleIds.
The bundle ids to resolve
All the bundles assets or a hash of assets for each bundle specified
// Manifest Example
const manifest = {
bundles: [
{
name: 'load-screen',
assets: [
{
alias: 'background',
src: 'sunset.png',
},
{
alias: 'bar',
src: 'load-bar.{png,webp}',
},
],
},
{
name: 'game-screen',
assets: [
{
alias: 'character',
src: 'robot.png',
},
{
alias: 'enemy',
src: 'bad-guy.png',
},
],
},
]
};
resolver.setManifest(manifest);
const resolved = resolver.resolveBundle('load-screen');
Override how the resolver deals with generating bundle ids. must be called before any bundles are added
the bundle identifier options
Sets the default URL search parameters for the URL resolver. The urls can be specified as a string or an object.
the default url parameters to append when resolving urls
A class that is responsible for resolving mapping asset URLs to keys. At its most basic it can be used for Aliases:
It can also be used to resolve the most appropriate asset for a given URL:
Other features include:
This class only cares about the URL, not the loading of the asset itself.
It is not intended that this class is created by developers - its part of the Asset class This is the third major system of PixiJS' main Assets class