pencil-js / spritesheet Goto Github PK

Adding 1 (or more ?) pixels around each tiles with the same color as the pixel next to it can avoid tiles edges being poisoned by the outer edges.

This is out of scope for now, but if some people need it, I'll consider adding it.

Some texture are limited in size, in this case it can be great to output multiple spritesheet according to a max-width or max-height option.

This is out of scope for now, but if some people need it, I'll consider adding it.

Hey, I just tried the usage example and I got a few errors on node v14.15.0:

• Must use import to load ES Module
• ReferenceError: writeFileSync is not defined

Here is a fixed version:

import spritesheet from "@pencil.js/spritesheet";
import fs from "fs";

// List of files to pack
const files = ["image1.png", "image2.jpg", "image3.gif"];
const options = {
    outputFormat: "png",
};
// Call the async function and extract the json and image values
(async () => {
    const { json, image } = await spritesheet(files, options);
    // Write the files (for example)
    fs.writeFileSync("example.png", image);
    fs.writeFileSync("example.json", JSON.stringify(json));
})();

Since you use .mjs I also had to add "type": "module" to my package.json.

Also, this line throws an error Unknown file extension ".json"for me. This may be related to mjs, where importing json is still experimental (https://nodejs.org/api/esm.html#esm_json_modules).

After fixing that and trying to load the spritesheet with PIXI.js I noticed the JSON is missing the meta.image property, which is expected by PIXI to reference the spritesheet file name.