Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Error on web-ifc-three instalation in a Next.js app #166

Open
gabrielwebphy opened this issue Apr 28, 2023 · 5 comments
Open

Error on web-ifc-three instalation in a Next.js app #166

gabrielwebphy opened this issue Apr 28, 2023 · 5 comments

Comments

@gabrielwebphy
Copy link

gabrielwebphy commented Apr 28, 2023

If i have a next.js app i install web-ifc-three, the following screen will appear:
Captura de tela 2023-04-28 085749

@gabrielwebphy
Copy link
Author

I also tested it with a React app (create-react-app). The setup worked fine, and the errors that prevented me from opening the Next app were just warnings while I was compiling. But when I tried to load the model with the IFCLoader, the following error appeared (the following images are the part of the code that resulted in the error, the compiling warnings and the error in the website console):
image
image
image

@gabrielwebphy gabrielwebphy changed the title I'm not able to install web-ifc-three in a Next.js app Error on web-ifc-three instalation in a Next.js app Apr 28, 2023
@sinedie
Copy link

sinedie commented May 9, 2023

There is a workaround is in the discord server: https://discord.com/channels/799990228336115742/1091078047228235877

Just need to transpile packages

@yukiyokotani
Copy link

yukiyokotani commented Jul 4, 2023

I think the package.json for web-ifc-three is wrong.
web-ifc-three refers to an ESM named IFCLoader.js in the "main" property of package.json.
However, according to the Node.js specification, if you want the file to be loaded as an ESM, the extension must be .mjs or the value of the "type" field must be "module".
web-ifc-three satisfies neither of these requirements.
Therefore, Next.js is mistakenly reading web-ifc-three as CommonJS.

@yukiyokotani
Copy link

yukiyokotani commented Jul 4, 2023

As a further problem, I tried rewriting the web-ifc-three's package.json to reference the IFCLoader.umd.cjs included with web-ifc-three in the "main" property, but this UMD is trying to load an ESM 'three/examples/jsm/utils/BufferGeometryUtils' (By the way, this can't solved without the .js extension, so I actually changed it to 'three/examples/jsm/utils/BufferGeometryUtils.js'.) with require, which also results in an error.

@antonyadhiban
Copy link

I am using the following post-install script as a workaround to avoid build issues in my angular application.

`const fs = require('fs');
const path = require('path');

const filePath = path.join(__dirname, 'node_modules/.pnpm/web-ifc-three@0.0.125_three@0.149.0/node_modules/web-ifc-three/IFCLoader.js');
let fileContent = fs.readFileSync(filePath, 'utf8');

fileContent = fileContent.replace(
"from 'three/examples/jsm/utils/BufferGeometryUtils'",
"from 'three/examples/jsm/utils/BufferGeometryUtils.js'"
);

fs.writeFileSync(filePath, fileContent);`

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants