Import issue when using web-ifc-viewer 1.0.218

[time-to-beem]

We use "web-ifc-viewer:1.0.216" in our project and it works fine.
We tried to update to 1.0.217 and it work fine.
Then, we tried to update to the version "1.0.218" and we have the following error when running "npm start":

ERROR in ./src/app/components/ifc-displayer/ViewerIFC.ts 59:24-36
export 'IfcViewerAPI' (imported as 'IfcViewerAPI') was not found in 'web-ifc-viewer' (module has no exports)

We also have the following warning:

WARNING in ./node_modules/web-ifc/web-ifc-api.js 21:70-77
Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

And the following error:

BREAKING CHANGE: The request './base-types' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.

We have the exact same issue with CameraProjections.

This happens when we build the project from scratch (I mean, I deleted the "node_modules", rebuild everything, and then it happens).
When I switch back to version 1.0.217, and rebuild the project, the error goes away.

I can't find why this happens, but it seems that somethin in ifc.js typescript types is broken.

Maybe you can point me in the right direction or fix it on you end ?

I use ReactJS 18.2.0 and Typescript 4.9.5. I stay available if you need more information.

Btw, great project :) Thank you very much ! Keep up the good work !

[time-to-beem]

Ok, I have more information.
Actually, the important message is the "BREAKING CHANGE" one.

Webpack created this breaking change, so now, it seems that you need to change the import for "base-types".

There is a webpack configuration for projects like me to keep the old way of doing things working. As explained in this stack overflow post : https://stackoverflow.com/questions/69427025/programmatic-webpack-jest-esm-cant-resolve-module-without-js-file-exten

We need to add in the file "webpack.config.js", in the part "module.rules", the following code :

{
  test: /\.m?js/,
  type: "javascript/auto",
},
{
  test: /\.m?js/,
  resolve: {
    fullySpecified: false,
  },
},

Unfortunately, this can be a lot of work. As most projects, like mine, uses bundlers like "create-react-app", we do not have a direct access to this file. There are ways to access it, but it is impractical. Right now, I will stay in 2.0.217 and wait for dust to settle.

There are an issue opened on create react app to add this configuration in their default webpack config :
facebook/create-react-app#11865

But as of my understanding, it will only be solved for new react project (not 100% sure about that though)

So it seems to me that you also should update your library to keep up with this new standard. As it is only a slight change in the import.
Unfortunately, I have some urgent issues on my own project. So, as I have the workaround of staying in 1.0.217 for some time and I am not sure what 1.0.218 would give me anyway (I was hoping it solved a bug on a bim model but it may not), I will not have time to look in ifc.js and make a PR.

[agviegas]

Hi @time-to-beem

We have officially released the new library components on September 20. This library substitutes web-ifc-three and web-ifc-viewer. Both WIV and WIT will remain up, but they will be deprecated and won't be maintained any longer. You can find the new docs here (the # is free, but we will likely make them public soon).

All our efforts are going towards components now. The API is very similar, so I strongly suggest you make the leap and start using it. You can start using it now (check out the latest alpha version in npm or see the big-restructure branch in the repo. If you still face this issue with it, you can open an issue there and we'll take a look.