fix: texture-packer should include format of image file in spritesheet json file's name

[gabrielecirulli]

This PR makes it so that texture-packer includes the image format of the underlying spritesheet within the file name of the spritesheet's json file.

For example, if it would previously output [email protected], it now outputs [email protected]

Rationale

Including the underlying image format as part of a json spritesheet's filename appears to be required by convention in Pixi's spritesheet loader (link to Pixi.js documentation).

I ran into an issue where I was generating spritesheets with 3 different resolutions (e.g. @1x, @2x, @3x) but when loading them into Pixi, all resolutions would be ignored and the first spritesheet in the list (regardless of what resolution it was) would be loaded.

After debugging the execution of both the Pixi loader and AssetPack, I determined the source of the problem: Pixi's loader does not attempt to parse the file names a spritesheet to extract metadata such as resolution if the spritesheet JSON file's filename does not adhere to the following filename convention: my-spritesheet{resolution}.{imageFormat}.json

Solution

I changed AssetPack's texture-packer to include the underlying texture file format in the spritesheet JSON file's filename.

I cannot see a reason why it should not be there, and I think the lack of it was by accidental omission rather than intentional. As it currently stands, spritesheets generated with AssetPack cannot be loaded correctly by Pixi when they contain multiple resolutions.

@Zyie please consider merging this PR or let me know how I could improve it.