No matching export in "node_modules/three/build/three.modules.js" for import "RGBFormat"

[Hillzkred]

Using web-ifc-viewer with Vite + React + TS. After running npm run dev I get this error.

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

    node_modules/web-ifc-viewer/dist/components/context/renderer/custom-outline-pass.js:2:51:
      2 │ import { Color, MeshNormalMaterial, NearestFilter, RGBFormat, ShaderMaterial, Vector2, Vector4, WebGLRenderTarget } from 'three';

[Curiosit]

I have the same error. I just started clean Vite + VUE webpage. Also when installing ifc-web-viewer there was earlier error:
npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: vue-ifc@0.0.0 npm ERR! Found: three@0.150.1 npm ERR! node_modules/three npm ERR! three@"^0.150.1" from the root project npm ERR! Could not resolve dependency: npm ERR! peer three@"^0.135.0" from web-ifc-viewer@1.0.213 npm ERR! node_modules/web-ifc-viewer npm ERR! web-ifc-viewer@"*" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force, or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

I had to run npm install ifc-web-viewer and then I got the same RGBFormat error

[Hillzkred]

I have the same error. I just started clean Vite + VUE webpage. Also when installing ifc-web-viewer there was earlier error: npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: vue-ifc@0.0.0 npm ERR! Found: three@0.150.1 npm ERR! node_modules/three npm ERR! three@"^0.150.1" from the root project npm ERR! Could not resolve dependency: npm ERR! peer three@"^0.135.0" from web-ifc-viewer@1.0.213 npm ERR! node_modules/web-ifc-viewer npm ERR! web-ifc-viewer@"*" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force, or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

I had to run npm install ifc-web-viewer and then I got the same RGBFormat error

I've been going inside the actual node_modules/web-ifc-viewer/dist/components/context/renderer/custom-outline-pass.js file and manually replacing RGBFormat with RGBAFormat and that seems to get the app to run, but idk what side effect this causes.

[Curiosit]

You seem to be right I think, here is a discussion that mentions that: https://discourse.threejs.org/t/attempted-import-error-rgbformat-is-not-exported-from-three-imported-as-rgbformat10/34230

So maybe the 'web-ifc-viewer' library should also be updated

[agviegas]

We'll update it today!

[nhutruong-arent]

Currently, I am using react-fiber in my project. The threejs version used in react-fiber is r139, while the threejs version used in web-ifc-viewer is r135. However, threejs version r137 has removed RGBFormat, which makes it impossible to build the project at the moment. I am unsure if the threejs version used in web-ifc-viewer has been upgraded.

[agviegas]

Hi @nhutruong-arent , it turns out that updating web-ifc-viewer to the latest three.js is not as easy as updating the dependency. It is likely that web-ifc-viewer will be substituted by components very soon, so we are unsure if spending time here is worth. We will publish the new documentation covering the new components API very soon this summer.

Anyway, I have just merged a PR that should help with this issue. I'll publish a new version to npm now.

[quasarchimaere]

@agviegas not sure if the version has been published or not since there is no new release on npmjs so far

[agviegas]

@quasarchimaere Sorry, my bad. Can you check again? It should be 1.0.216.