search

pixijs / pixi-react

Write PIXI apps using React declarative style
https://pixijs.io/pixi-react/
MIT License
2.33k stars 177 forks source link

TSLint error #343

Closed scq000 closed 2 years ago

scq000 commented 2 years ago

Description

When I use the demo in my code, the following error shows by tslint:

TS2322: Type '{ children: Element; x: number; y: number; }' is not assignable to type 'IntrinsicAttributes & Partial<Omit<PIXI.Container, any> & WithPointLike<P>> & InteractionEvents & { ref?: Ref<...> | undefined; } & { ...; }'.
  Property 'x' does not exist on type 'IntrinsicAttributes & Partial<Omit<PIXI.Container, any> & WithPointLike<P>> & InteractionEvents & { ref?: Ref<...> | undefined; } & { ...; }'.
    40 |     <div>
    41 |       <Stage width={300} height={300} options={{ backgroundAlpha: 0 }}>
  > 42 |         <Container x={150} y={150}>
       |                    ^
    43 |           <Bunny />
    44 |         </Container>
    45 |       </Stage>

Additional info

scq000 commented 2 years ago

Typescript version: 4.6.4

scq000 commented 2 years ago

And I found when I config the module item to "commonjs" in tsconfig.json file, the error has been disappeared. And now the value of module item in my project is "esnext".

inlet commented 2 years ago

Unfortunately I cannot reproduce this issue, are you using React 18 types perhaps?

LeoTheG commented 2 years ago

For me, it was because I did create-react-app with react 18, as mentioned by @inlet I had to remove package-lock.json, node_modules, and install these modules (types if using typescript) npm i -D @types/react@17.0.1 @types/react-dom@17.0.1 react@17.0.1 react-dom@17.0.1

prsauer commented 2 years ago

Very similar issue:

Type '{ image: string; width: number; height: number; }' is not assignable to type 'IntrinsicAttributes & Partial<Omit<PIXI.Sprite, any> & WithPointLike<P>> & WithSource & InteractionEvents & { ...; } & { ...; }'.

react 17.0.2 react-dom 17.0.2 pixi 6.4.2 react-pixi 6.8.0

cmd+shift+p in VScode -> Restart TS resolved. I've been noticing I have to do this more and more :\

akkadaska commented 2 years ago

I found the same issue and resolved by making the react and also its types versions from 18 to 17.0.2. Please make sure you don't use not only react version 18 but also @types/react version 18 as @LeoTheG mentioned.

inlet commented 2 years ago

I close this issue as this is related to React 18, see #337