use free texture packer for phaser3

Question

I'm using phaser3 and free texture packer, is it possible to do that? if yes please tell me how? I tried to use addAtlasJSONHash but it was logging that this function is undefined, so I tried game.addAtlasJSONHash, but the same error was happening

Answer 1

Depending on your use case there a serveral ways, for the https://free-tex-packer.com/. Here is one fast/easy way, to get everything up and running.
(Just in case: I assume you are using Phaser3)

In the App

• Select Format: "Phaser3"
• Add images
• click export
• download the zip

In Phaser

• Unpack the json and png file from the zip into our game-app-folder

• in Scene preload: load the file(s), with atlas(docs)

    this.load.atlas('atlas', 'texture.png', 'texture.json');
  

• to add a sprite to the scene just use (docs):

    // parameters are x,y, texture / atlas, frame-index
    this.add.sprite(10, 10, 'atlas', 0);
  

Extra-Info: On the official phaser webpage there are many examples, to most of the features. check out this basic one for atlas https://phaser.io/examples/v3/view/textures/frames-from-single-atlas

Answer 2

It is a bit old, but did you checkout this tutorial? https://www.codeandweb.com/texturepacker/tutorials/how-to-create-sprite-sheets-for-phaser3

It exmplains how this, is done with multiatlas.