Phaser3 Dungeon Crawler

Prerequisites

You'll need Node.js, a package manager (I use yarn), and Parcel installed.

It is highly recommended to use Node Version Manager (nvm) to install Node.js.

Install Node.js with nvm:

nvm install node

nvm use node

Then install Parcel:

yarn global add parcel-bundler

Getting Started

Start development server:

yarn start

To create a production build:

yarn build

Production files will be placed in the dist folder. Then upload those files to a web server. 🎉

Project Structure

    .
    ├── dist
    ├── node_modules
    ├── public
    ├── src
    │   ├── scenes
    │   │   ├── GameScene.ts
    │   ├── index.html
    │   ├── main.ts
    ├── package.json

The contents of this template is the basic Phaser3 getting started example.

Static Assets

Any static assets like images or audio files should be placed in the public folder. It'll then be served at http://localhost:8000/images/my-image.png

Example public structure:

    public
    ├── images
    │   ├── my-image.png
    ├── music
    │   ├── ...
    ├── sfx
    │   ├── ...

They can then be loaded by Phaser with this.image.load('my-image', 'images/my-image.png').

TypeScript ESLint

This template uses a basic typescript-eslint set up for code linting.

It does not aim to be opinionated.

Other Notes

parcel-plugin-clean-easy is used to ensure only the latest files are in the dist folder. You can modify this behavior by changing parcelCleanPaths in package.json.

parcel-plugin-static-files is used to copy static files from public into the output directory and serve it. You can add additional paths by modifying staticFiles in package.json.