Giter Club home page Giter Club logo

phaser3-dungeon-crawler-starter's Introduction

Dungeon Crawler Starter

A starter project for creating a Dungeon Crawler with Phaser 3

License

Overview

This is a Dungeon Crawler game starter project for the Phaser game framework.

The code corresponds to an 8 part series on YouTube demonstrating how it was made.

Check out the playable demo here.

Getting Started

Clone this repository with git-lfs and run:

npm install
npm run start

If you don't have git-lfs installed then get it here: https://git-lfs.github.com

All the image and audio files in this repository is stored with git-lfs. Alternatively you can download a zip from latest release here.

Credits

The tiles and lizard enemy are from Dungeon Tileset II.

Hero character is from Legend of Faune.

License

MIT License

phaser3-dungeon-crawler-starter's People

Contributors

supertommy avatar

Stargazers

avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar

Watchers

avatar avatar avatar avatar avatar

Forkers

greenandro percym hun-a olawalejoseph earlachromatic yatharthgupta7 king-joel egorovg13 mblodorn makingbrowsergames 936695852 mona-src mmassoni mit120 lidya1234 bigbadai juliannevela alemkin mauld-uci s-develop treywroberts jun-ce yerasyla heyrio samme kroma0 nighthack36 hanklobo asemxu steveyeoks mikelun lilianboinard ivanpezzoni90 richardram87 diskjunky emmettcrass chazkondo longshot2k20 extrasaucestudio gwenael-even nawtyd0g wntmddl4 daniellukonis douglasdl achu94 thor10 parkdaeyuidev kknownow drzedd42 defi-coder-news-letter cybaj ag-game gamegrief frault75 demiremrece amon-s justaba yassmittal slytechiefrommagentashore emc23 wessel-t

phaser3-dungeon-crawler-starter's Issues

Run error

Cant run :/ .. I just Clone reposity & "npn install", then "npm run start"

image

Errors

Hi, trying to make your project work - no bueno:

  1. since you installed parcel with -g flag, i had to add it manually into project, so
    npm init
    npm install
    npm install parcel-bundler --save-dev

  2. npm start, i get warnings and errors in browser's console:

`phaser.js:74289 generateFrameNames: Frame missing: run-down-1.png from texture: faune
phaser.js:74289 generateFrameNames: Frame missing: run-down-2.png from texture: faune
phaser.js:74289 generateFrameNames: Frame missing: run-down-3.png from texture: faune
phaser.js:74289 generateFrameNames: Frame missing: run-down-4.png from texture: faune
phaser.js:74289 generateFrameNames: Frame missing: run-down-5.png from texture: faune
phaser.js:74289 generateFrameNames: Frame missing: run-down-6.png from texture: faune
phaser.js:74289 generateFrameNames: Frame missing: run-down-7.png from texture: faune
phaser.js:74289 generateFrameNames: Frame missing: run-down-8.png from texture: faune
generateFrameNames @ phaser.js:74289
createCharacterAnims @ CharacterAnims.ts:21
phaser.js:74289 generateFrameNames: Frame missing: run-up-1.png from texture: faune
phaser.js:74289 generateFrameNames: Frame missing: run-up-2.png from texture: faune
phaser.js:74289 generateFrameNames: Frame missing: run-up-3.png from texture: faune
phaser.js:74289 generateFrameNames: Frame missing: run-up-4.png from texture: faune
phaser.js:74289 generateFrameNames: Frame missing: run-up-5.png from texture: faune
phaser.js:74289 generateFrameNames: Frame missing: run-up-6.png from texture: faune

[MANY MORE WARNINGS HERE]

[AND AT THE END, FOLLOWING WARNING:]

phaser.js:135325 createStaticLayer is deprecated. Use createLayer

[AND FOLLOWING ERROR:]

phaser.js:43946 Uncaught TypeError: Cannot read properties of undefined (reading 'texture')
at AnimationState.setCurrentFrame (phaser.js:43946)
at AnimationState.handleStart (phaser.js:43412)
at AnimationState.startAnimation (phaser.js:43392)
at AnimationState.play (phaser.js:43266)
at new Faune (Faune.ts:44)
at GameObjectFactory.faune (Faune.ts:243)
at Game.create (Game.ts:54)
at SceneManager.create (phaser.js:100338)
at SceneManager.bootScene (phaser.js:100218)
at SceneManager.start (phaser.js:100926)`

  1. Game.ts shows errors in VSCode (Line 47):
    map.createStaticLayer('Ground', tileset)
    The error is on 'createStaticLayer': "Property 'createStaticLayer' does not exist on type 'Tilemap'.ts(2339)"

  2. package.json phaser version:
    "dependencies": { "phaser": "^3.22.0" },
    is the same as what you're using, so why can't it recognize that method? Did you by chance upgrade without testing?

  3. when i change 'createStaticLayer' to 'createLayer', i get the same warnings (except the last one), and following error:
    phaser.js:43946 Uncaught TypeError: Cannot read properties of undefined (reading 'texture')

I suppose the parcel package didn't properly locate the files in the filesystem (i see you using the static files copy 'public' and cleanpaths plugin, i suppose the former fails to locate the files). Can you recheck and fix your repo? (or update your tldr installation guide).

Cheers hope this helps.

Broken references

Missing packages required to build;

  • npm install parcel (required server to run the game - ##note:## see Additional Notes first if running on Windows)
  • npm install parcel-bundler (required to serve the game assets correctly - the urls will return HTML instead of their content otherwise)
  • Modify ./src/index.html to have the type in the script tag on #7 like so (game won't compile without this);
<script src="main.ts" type="module"></script>
  • Add the following to the top of the index.html file (missing tag causes the browser to run in compatibility mode)
<!DOCTYPE html>
  • In package.json, change the script entries that have --out-dir to --dest-dir (breaking change for parcel)

Additional notes for anyone building on Windows:

  • install Visual Studio Community Edition (latest at time of writing is 2022), and ensure that "Desktop Development for C++" is an installed module - required for npm install to run correctly
  • the node package parcel-bundler does not appear to run correctly via the standard command prompt. I was able to get a successful run by running npm run start via bash terminal created from within VSCode (get Git Bash here), after installing parcel-bundler from within the bash instance (installing from the command prompt does not appear to work).

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.