digitsensitive / phaser3-typescript Goto Github PK
View Code? Open in Web Editor NEWPhaser 3 and TypeScript
License: MIT License
Phaser 3 and TypeScript
License: MIT License
should be constructor(config: GameConfig)
I tried to update to the current phaser version 3.16.1, but than everything breaks, because the games uses a removed API configuration.
Even if I only use the boilerplate as entry point, the project tries to build everything, and fails, because of the API problem.
Can you adjust the game examples? Is it possible, to configure the project in the way, that only a selected example, or the boilerplate, is build?
I know this is not the right place,
But you are the only repo where I found a correct description of the game configuration.
Where can I find all the description of these structures for Phaser 3?
For example, what type and behavior correspond to the field "scene" in the game-configuration
and other structures?
Thank you
yarn webpack-boilerplate
leads to the error [webpack-cli] Error: Cannot find module 'Phaser'
. Changing 'Phaser'
to 'phaser'
(lower-case) in the import of src/boilerplates/webpack-boilerplate/src/game.ts
and in test: require.resolve('Phaser')
in src/boilerplates/webpack-boilerplate/webpack.config.js
fixes it. I don't know if I'm the only one with this issue, if not I can create a pull request if necessary.
I'm new to Phaser and TypeScript, but I believe I ran into an issue during development where I got a compilation error due to a missing property in the TypeScript definition of SmoothedKeyControlConfig.
I believe it should be a simple fix of adding
/**
* The Key to be pressed that will move the Camera down.
*/
down?: Phaser.Input.Keyboard.Key;
to line 239.
How can I debug the project with VS Code? When I set a breakpoint and start debugging, the breakpoint gets "Unverified breakpoint". How do I have to configure this project, to get debugging in VS Code working?
I also tried the https://github.com/TristanBonsor/phangular project, and there, the debugging works. But I want phaser with typescript without angular.
Hello,
I want to know if your phaser.d.ts work with the v3.11 of Phaser and how did you generate it ?
Thx
If I change the webpack.config.js to point to various games, I run into this compile issue:
https://github.com/photonstorm/phaser3-docs/issues/24
For example,
entry: './src/games/space-invaders/game.ts',
ERROR in /Users/sschafer/personal/projects/phaser3-typescript/src/games/asteroid/objects/asteroid.ts
[tsl] ERROR in /Users/sschafer/personal/projects/phaser3-typescript/src/games/asteroid/objects/asteroid.ts(37,15)
TS2339: Property 'allowGravity' does not exist on type 'Body | StaticBody | BodyType'.
Property 'allowGravity' does not exist on type 'BodyType'.
What's the best way to resolve this?
Why are we accepting strings as valid values for the game height / width? It just means I have to cast them to whenever I want to perform arithmetic operations (otherwise I get the following error: [ts] The left-hand side of an arithmetic operation must be of type 'any', 'number', 'bigint' or an enum type. [2362])
Happy to open a pull request, just didn't know if it's there for a reason
The game object "space shooter" is not displayed ๐ญ๐ญ๐ญ
Google chrome console outputs an error
GET http://localhost:8080/dist/bundle.js net::ERR_ABORTED 404 (Not Found)
I changed npm script settings and now it shows up!
"dev": "webpack --mode development && webpack serve --mode development"
Finally, thank you for making so many great games! ๐ฅฐ
You can create a example like game Arcuz.
Thanks you!
Is the update to version 3.18 scheduled?
I've never used node.js and npm before so I'm stumbling across some newbie mistakes. One error I get is that when I try to run npm run dev, Git bash returns the following error code:
npm ERR! missing script: dev
0 info it worked if it ends with ok
1 verbose cli [ 'C:\Program Files\nodejs\node.exe',
1 verbose cli 'C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js',
1 verbose cli 'run',
1 verbose cli 'dev' ]
2 info using [email protected]
3 info using [email protected]
4 verbose stack Error: missing script: dev
4 verbose stack at run (C:\Program Files\nodejs\node_modules\npm\lib\run-script.js:155:19)
4 verbose stack at C:\Program Files\nodejs\node_modules\npm\lib\run-script.js:63:5
4 verbose stack at C:\Program Files\nodejs\node_modules\npm\node_modules\read-package-json\read-json.js:115:5
4 verbose stack at C:\Program Files\nodejs\node_modules\npm\node_modules\read-package-json\read-json.js:418:5
4 verbose stack at checkBinReferences_ (C:\Program Files\nodejs\node_modules\npm\node_modules\read-package-json\read-json.js:373:45)
4 verbose stack at final (C:\Program Files\nodejs\node_modules\npm\node_modules\read-package-json\read-json.js:416:3)
4 verbose stack at then (C:\Program Files\nodejs\node_modules\npm\node_modules\read-package-json\read-json.js:160:5)
4 verbose stack at ReadFileContext. (C:\Program Files\nodejs\node_modules\npm\node_modules\read-package-json\read-json.js:332:20)
4 verbose stack at ReadFileContext.callback (C:\Program Files\nodejs\node_modules\npm\node_modules\graceful-fs\graceful-fs.js:78:16)
4 verbose stack at FSReqWrap.readFileAfterOpen [as oncomplete] (fs.js:237:13)
5 verbose cwd C:\Users\Yassi\TEST
6 verbose Windows_NT 10.0.17134
I don't know what I should be adding to my package.json file to make this work. Could anyone help me with this please?
Image links in Beginner and Intermediate sections of the README.md file are broken.
These show broken in Chrome and Edge.
Hi.
First of all, thank you for creating and maintaining this.
I am in the middle of a migration from Haxe/OpenFL and your boilerplate code has saved my life.
Now, I see that you generate a single bundle.js file where my previous framework (and the phaser pure js examples) use one file for phaser and another for the game.
is it better to have multiple smaller js files? or is it better one big blob?
Once again, thank you so much for your work!
The current webpack configuration and examples use images that are loaded from the src
folder, and a html file that sits in the root of the project instead of the dist
folder.
Would it be possible to include a webpack config file that places all needed files in the dist
folder?
Currently, running nom run build
results in a huge .js
file that includes all images... that can't be right?
When I try to run the examples and webpack boiler plate I get this error:
โฏ yarn run webpack-boilerplate
yarn run v1.22.15
$ cd src/boilerplates/webpack-boilerplate && yarn && yarn run dev
[1/4] Resolving packages...
success Already up-to-date.
$ webpack --mode development && webpack serve --mode development
[webpack-cli] Failed to load '/mnt/data/projects/tests/phaser3-typescript/src/boilerplates/webpack-boilerplate/webpack.config.js' config
[webpack-cli] Error: Cannot find module 'Phaser'
I could solve it changing the expose-loader plugin config, requiring phaser lowercased:
{
test: require.resolve('phaser'),
loader: 'expose-loader',
options: { exposes: { globalName: 'Phaser', override: true } }
}
All examples I tried worked all right from here excepting boilerplate which had to unpate the Phaser import to:
import 'phaser';
Also, I found out that webpack sourcemaps are not showing exactly ts code as it does the parcel ones, is this normal?
Thank you for your efforts.
I am using your phaser.d.ts well.
I have one question.
Why are not you deploying type definition?.
I want you to merge your code to type definition repository.
So, many people will be able to use your type definition.
just command
npm install @types/phaser
Iโm using a modified version of github pages deploy to build and run my game on github pages branch.
running
yarn install
yarn dev
results in the bundle.js being committed to the gh-pages branch, but nothing else. How can I fix this?
"endless-runner" does not start ๐ญ๐ญ๐ญ
Here is the error message I got
[webpack-cli] Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
- options has an unknown property 'publicPath'. These properties are valid:
object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, magicHtml?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, server?, setupExitSignals?, setupMiddlewares?, static?, watchFiles?, webSocketServer? }
error Command failed with exit code 2.
I removed the PublicPath entry from the webpack configuration and it started.
Finally, thank you for making so many great games! ๐ฅฐ
As of writing this, Parcel version 2.10.3 has now been released.
Now there are some breaking changes with Parcel 2.0 including how static assets are handled and how TypeScript needs to be configured. For my personal use, I decided to use the Parcel boilerplate starter in this repo for my own purposes and I thought I would share my upgrade effort with the community.
You can see the changes I've made in my fork here.
I believe I have maintained your particle demo but the main effort is ensuring that Parcel 2 is the latest version.
I'd like to make a pull request, with your approval.
Thanks.
"Flappy Bird" title appears to show "Coin Runner"
phaser3-typescript/src/games/flappy-bird/index.html
Lines 3 to 12 in e1f2182
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.