Tiled Custom Tile Studio

Installation

Pre-requisites

• npm install -g nodemon
• npm install -g eslint

Install the node module requirements

npm install

Running the Studio

1. Open 3 terminal windows / tabs
2. Run npm start in the 1st terminal tab
3. Run npm run start-webpack in the 2nd terminal tab (this automatically builds the development version of your custom tile)
4. Run npm run start-webpack-dist in the 3rd terminal tab (this automatically builds the compiled distributions)

Creating a new custom tile

1. Kill any running processes if needed.
2. Edit tiles.json and add a new entry with an id, name, and shortName. The id must be unique.
3. Create a new JavaScript file in ./src with the same name as the id in tiles.json. (Feel free to duplicate an existing tile to get started).
4. Start the studio again (see "Running the Studio").

Submitting tiles

As you build and test your tiles locally, the tile bundle will be automatically generated by webpack. Once all of the desired functionality has been completed, simply send the bundle over to the Tiled team.

1. Check the dist directory for your new folder (matching the name of your tile)
2. Send the following items over to the Tiled development team by emailing us at dev@tiled.co:

• tiles.json (with your new tile additions)
• Raw custom tile source (src/yourNewTile.js)
• Built directory under the dist directory to the Tiled team (dist/yourNewTile)