Typescript Error with Geometry props
👋 hi there, for issues that aren't that pressing, that could be related to threejs etc, please consider github discussions.
TypeScript Error with boxGeometry props
I'm getting TypeScript errors when trying to use boxGeometry component:
<boxGeometry args={[1, 1, 1]} />
Error:
Using React Native with Expo and TypeScript. Package versions:
- @react-three/fiber: ^9.1.0
- three: ^0.174.0
- typescript: ^5.3.3
Could you please help with the correct type definitions for the boxGeometry component?
can you help me??
Is it typescript or eslint error in your case?
Now I'm getting ESLint: Unknown property 'intensity' found(react/no-unknown-property) for all the props, but it compiles ok.
"eslint": "^8.41.0",
I'm facing the same problem with ESLint error "Unknown property 'args' found".
I tried changing:
<boxGeometry args={[1, 1, 1]} />
to:
<boxGeometry primitive={[1, 1, 1]} />
But the problem persists. The suggested solution is to add the following ESLint rule to .eslintrc.js:
"react/no-unknown-property": ["error", {
ignore: ["args", "intensity", "position", "rotation", "scale"]
}]
Is there a better solution for this problem? args seems to be the correct property according to the Three.js documentation.
Hello, to help out I need to know a little more info.
- What is the TypeScript error you are getting exactly?
- For ESLint, I need to be able to reproduce the issue. Is there a minimal reproduction? When doing a vite install, ESLint works for me.
I didn't get the TS error. But I got the same eslint error.
ERROR(ESLint) Unknown property 'map' found (react/no-unknown-property)
<mesh> <planeGeometry args={[width || texture?.image?.width, height || texture?.image?.height]} /> <meshStandardMaterial map={texture} /> </mesh>
My eslint version is 9.21.0.
I'm facing the same problem with ESLint error "Unknown property 'args' found".
I tried changing:
<boxGeometry args={[1, 1, 1]} /> to:
<boxGeometry primitive={[1, 1, 1]} /> But the problem persists. The suggested solution is to add the following ESLint rule to
.eslintrc.js:"react/no-unknown-property": ["error", { ignore: ["args", "intensity", "position", "rotation", "scale"] }] Is there a better solution for this problem?
argsseems to be the correct property according to the Three.js documentation.
This problem is bothering me a lot, but it seems that using "ignore" is still the current solution.
https://github.com/pmndrs/react-three-fiber/issues/2623 https://github.com/jsx-eslint/eslint-plugin-react/issues/3423