theatre-js / theatre

Motion design editor for the web
https://www.theatrejs.com
Apache License 2.0
11.23k stars 357 forks source link

Issue: Error When Using editable from @theatre/r3f #494

Closed voitb closed 2 months ago

voitb commented 2 months ago

I followed the setup documentation for react-three-fiber (R3F) provided here. However, I encountered an issue when importing { editable as e, SheetProvider } from @theatre/r3f. Adding editable results in the following error:

@theatre_r3f_dist_ex…js?v=a742d302:11267 Uncaught SphereBufferGeometry is not part of the THREE namespace! Did you forget to extend? See: https://github.com/pmndrs/react-three-fiber/blob/master/markdown/api.md#using-3rd-party-objects-declaratively

Additionally, there was a similar problem with PlaneBufferGeometry, which threw the error:

No matching export in "node_modules/three/build/three.module.js" for import "PlaneBufferGeometry"

node_modules/@theatre/r3f/dist/extension/index.esm.js:21622:2:
  21622 │   PlaneBufferGeometry,
        ╵   ~~~~~~~~~~~~~~~~~~~

10:18:09 [vite] error while updating dependencies:
Error: Build failed with 1 error:
node_modules/@theatre/r3f/dist/extension/index.esm.js:21622:2: ERROR: No matching export in "node_modules/three/build/three.module.js" for import "PlaneBufferGeometry"

Steps to Reproduce

Follow the setup guide from Theatre.js documentation. Import { SheetProvider } from '@theatre/r3f' and notice the error with PlaneBufferGeometry. Import { editable as e, SheetProvider } from @theatre/r3f and observe the error related to SphereBufferGeometry.

Environment

react-three-fiber version: [8.16.8] three version: [0.166.1] @theatre/r3f version: [0.5.1] Build tool: Vite Is there any way to fix this issue without downgrading three.js and R3F versions to use the Buffer elements? If not, what versions should be used to avoid this issue?

I managed to overcome the PlaneBufferGeometry issue by editing index file to PlaneGeometry.

Thank you for your assistance!

voitb commented 2 months ago

Ok, I realized theatre version should be latest for this to be working :) please update it in your docs, sorry for misunderstanding