Comments (14)
OK I may have done something wrong then as the example react code wouldn't load without that. I'm also receiving an error in Chrome consol saying error : game config is needed or something along those lines. I'll post the full error when I'm back at my computer and also try restarting from scratch.
from ion-phaser.
Just spun up a brand new project with ion-phaser/react and had the same result. It doesn't work until I add
componentDidMount() { new Phaser.Game(this.state.game) }
Same error present in chrome console as well.
from ion-phaser.
@jdnichollsc I have the same problem.
You can find my example repo at https://github.com/nagyv/ionphaser-react-demo
from ion-phaser.
Try the last version 1.2.0 and let me know 👍
Just did and it's working. Thanks!
from ion-phaser.
just realized that this doesn't solve the config error I'm getting, but does get the phaser scene to actually display with the rotating hello world.
from ion-phaser.
componentDidMount() {
new Phaser.Game(this.state.game)
}
Nope, you don't need that, the idea with this web component is initialize the game internally as you can see here => https://github.com/proyecto26/ion-phaser/blob/master/src/components/ion-phaser/ion-phaser.tsx#L60
from ion-phaser.
Let me know please, it would be awesome if you can share your code 👍
from ion-phaser.
https://github.com/gabeo14/ion-phaser-react-test
Here's my repo for it as it is now. Feel free to take a look. I'll try to replicate that error tomorrow when I get a chance.
from ion-phaser.
Remember: remove this new Phaser.Game(this.state.game)
from ion-phaser.
So when I run it as localhost with that removed/ commented out I just get a white screen. When I inspect, this is what's in the body tag, along with a few script tags.
When it's present though, I get the phaser stuff displaying with the dark background and rotating text in the center.
The error that I have in the chrome console, regardless of the presence of that line is as follows.
Error: The configuration of the game is required
at IonPhaser.initializeGame (ion-phaser.entry.js:156)
at IonPhaser.componentWillLoad (ion-phaser.entry.js:209)
at ionphaser-c6124867.js:480
at step (ionphaser-c6124867.js:146)
at Object.next (ionphaser-c6124867.js:77)
at ionphaser-c6124867.js:49
at new Promise ()
at push.../node_modules/@ion-phaser/core/dist/esm/legacy/ionphaser-c6124867.js.__awaiter (ionphaser-c6124867.js:26)
at safeCall (ionphaser-c6124867.js:465)
at ionphaser-c6124867.js:522
at step (ionphaser-c6124867.js:146)
at Object.next (ionphaser-c6124867.js:77)
at ionphaser-c6124867.js:49
at new Promise ()
at push.../node_modules/@ion-phaser/core/dist/esm/legacy/ionphaser-c6124867.js.__awaiter (ionphaser-c6124867.js:26)
at scheduleUpdate (ionphaser-c6124867.js:506)
at ionphaser-c6124867.js:902
at step (ionphaser-c6124867.js:146)
at Object.next (ionphaser-c6124867.js:77)
at fulfilled (ionphaser-c6124867.js:29)
console. @ index.js:1375
Not sure if the two issues are related or not. I'll start over with a new react project and fresh install of ion-phaser-react and let you know if anything changes.
Edit: The html didn't display as an embedded code snippet, so I just edited to paste it normally
from ion-phaser.
let me debug at night
from ion-phaser.
I'm going to publish a new version, in the meantime can you download the repo and debug from demo-react
folder? https://github.com/proyecto26/ion-phaser/blob/master/demo-react/
Please let me know
from ion-phaser.
Try the last version 1.2.0 and let me know 👍
from ion-phaser.
Awesome, sorry for the delay!
from ion-phaser.
Related Issues (20)
- How to upgrade to Phaser 3.52.0 HOT 14
- How do I declare functions in phaser using vue? HOT 8
- Issue while using with Vue 3 - Canvas not loaded HOT 8
- Strange Error With Using Spine HOT 4
- Using a custom `Phaser.Game` class HOT 1
- How to use with phaser 2? HOT 1
- Property 'ion-phaser' does not exist on type 'JSX.IntrinsicElements' HOT 2
- Next.js: ReferenceError: Phaser is not defined HOT 3
- image cannot be loaded HOT 3
- use in Taro HOT 3
- How to load a web picture HOT 1
- Interested making it work with next.js HOT 20
- React HTMLIonPhgaissue HOT 1
- Access Vue this from the scene object HOT 6
- Failed to parse source map warnings - @ion-phaser/react HOT 1
- Support React v17 HOT 3
- [Question] Is it possible to use reactive properties inside ion-phaser?
- Some functions are missing HOT 3
- Support React 18
- can not reinitialize after destroy becauseof plugin HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ion-phaser.