davidfig / pixi-viewport

A highly configurable viewport/2D camera designed to work with pixi.js
https://davidfig.github.io/pixi-viewport/
MIT License
1.04k stars 173 forks source link

`TypeError: Cannot set properties of undefined (setting '_parentID')` #486

Open jerrygreen opened 4 months ago

jerrygreen commented 4 months ago

I'm getting this error in runtime when trying to addChild:

const textureBunny = await Assets.load('https://pixijs.com/assets/bunny.png');
const bunny = new Sprite(textureBunny);
viewport.addChild(bunny) // <-- here the issue happens

Also, typescript complains about type mismatch:

Argument of type 'Sprite' is not assignable to parameter of type 'DisplayObject'.

Versions:

"pixi-viewport": "5.1.0",
"pixi.js": "8.1.0"

It well might be directly related to this issue:

ViniciusFXavier commented 4 months ago

@jerrygreen pixi-viewport for now works with pixi.js version 8.0.4, "with 8.1.0 has some break changes for my". Try change pixi.js to 8.0.4.

Just to be sure, look where you are importing the Sprite.

This example of Readme.md works fine to my.

import * as PIXI from 'pixi.js'
import { Viewport } from 'pixi-viewport'

const app = new PIXI.Application()
document.body.appendChild(app.view)

// create viewport
const viewport = new Viewport({
    screenWidth: window.innerWidth,
    screenHeight: window.innerHeight,
    worldWidth: 1000,
    worldHeight: 1000,

    events: app.renderer.events // the interaction module is important for wheel to work properly when renderer.view is placed or scaled
})

// add the viewport to the stage
app.stage.addChild(viewport)

// activate plugins
viewport
    .drag()
    .pinch()
    .wheel()
    .decelerate()

// add a red box
const sprite = viewport.addChild(new PIXI.Sprite(PIXI.Texture.WHITE))
sprite.tint = 0xff0000
sprite.width = sprite.height = 100
sprite.position.set(100, 100)
jerrygreen commented 4 months ago

No, this bug seems to be related to the issue I referenced above, it has nothing to do with 8.0.4 or 8.1.0

I just installed pixi-viewport from GitHub master branch, and it turned out to work just fine. So it’s indeed bug with version on npm.

Maybe there are some incompatibilities with 8.1.0, but that’s not one of those.

zhouccccc commented 2 months ago

No, this bug seems to be related to the issue I referenced above, it has nothing to do with 8.0.4 or 8.1.0

I just installed pixi-viewport from GitHub master branch, and it turned out to work just fine. So it’s indeed bug with version on npm.

Maybe there are some incompatibilities with 8.1.0, but that’s not one of those.

yep I think you are right. In my case, I use the latest pixi.js version and downgrade pixi-viewport to v5.0.3 (same to master branch),it works as normal.