mattjennings / svelte-pixi

Create PixiJS apps with Svelte
https://svelte-pixi.com
MIT License
112 stars 15 forks source link

Ticker Error #27

Closed michaels-account closed 1 year ago

michaels-account commented 1 year ago

Hi!

When using any of the ticker components, both onTick and getTicker, I recieve this error message:

[HMR][Svelte] Failed to rerender <PixiApp>
logError @ proxy.js:15
(anonymous) @ proxy.js:410
reload @ proxy.js:406
(anonymous) @ hot-api.js:150
(anonymous) @ client.ts:528
(anonymous) @ client.ts:445
(anonymous) @ client.ts:296
queueUpdate @ client.ts:296
await in queueUpdate (async)
(anonymous) @ client.ts:159
handleMessage @ client.ts:157
(anonymous) @ client.ts:91
proxy.js:19 TypeError: Cannot destructure property 'ticker' of 'getTicker(...)' as it is undefined.
    at instance (PixiApp.svelte:6:11)
    at init (index.mjs:1891:11)
    at new PixiApp (PixiApp.svelte:14:33)
    at createComponent (svelte-hooks.js:206:20)
    at targetCmp.$replace (svelte-hooks.js:269:15)
    at refreshComponent (proxy.js:171:15)
    at ProxyAdapterDom.rerender (proxy-adapter-dom.js:77:5)
    at proxy.js:408:9
    at Array.forEach (<anonymous>)
    at Object.reload (proxy.js:406:15)

I tested by copying your examples from the documentation. Again, pretty new to all this so there's a good chance I'm missing something!

mattjennings commented 1 year ago

It is likely that you are calling onTick outside of an <Application /> component. Any usage of onTick must be from a child component of <Application /> or <Ticker />.

You can see a codesandbox example here - https://codesandbox.io/s/svelte-pixi-vite-ontick-mfobo7

Hopefully that helps! If not, please share a reproducible example so I can take a look. That can either be a link to a github repo or codesandbox, either would work.

michaels-account commented 1 year ago

Ahha you're right. Thanks for your help again!