Component import problem

[hakancunier]

Last day i updated my npm packages and got this error:

./node_modules/its-fine/dist/index.mjs
Can't import the named export 'Component' from non EcmaScript module (only default export is available)

[CodyJasonBennett]

Which tool are you using for this? Webpack? It would help to know which and what version.

[abhi-dasgupta]

i started getting this too.. simply by deleting node_modules and running npm i

[CodyJasonBennett]

Some basic information about your environment would go a long way to solving this. See the above, a repository recreating the issue would be ideal.

[abhi-dasgupta]

ok so this is hot i ended up here.

1. developing with create-react-app
2. faced this issue Uncaught ReferenceError: process is not defined (NOT react-error-overlay) facebook/create-react-app#12212
3. did what is suggested there and in similar issues, one of steps is downgrading react-scripts
4. previous errors go away and now I get this error
   has nothing to do with my code, everything was working fine, until today with npm i ...

[CodyJasonBennett]

Downgrading react-scripts puts you to v4 which does not understand Node ESM (related: facebook/create-react-app#10356). Could you try with a clean install on v5?

[abhi-dasgupta]

sorry my bad, i get a different set of errors with v4 with v5.0.1 I get the below error on start
./node_modules/its-fine/dist/index.mjs
Can't import the named export 'Component' from non EcmaScript module (only default export is available)

all packages
"@emotion/react": "^11.10.4",
"@emotion/styled": "^11.10.4",
"@mui/icons-material": "^5.10.6",
"@mui/material": "^5.10.6",
"@react-three/drei": "^9.32.1",
"@react-three/fiber": "^8.8.2",
"@react-three/postprocessing": "^2.6.2",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"moment": "^2.29.4",
"nanoid": "^4.0.0",
"nipplejs": "^0.9.1",
"react": "^18.2.0",
"react-animated-cursor": "^2.5.1",
"react-dom": "^18.2.0",
"react-favicon": "^1.0.1",
"react-ga": "^3.3.1",
"react-joyride": "^2.5.3",
"react-scripts": "5.0.1",
"simple-peer": "^9.11.1",
"socket.io-client": "^4.5.2",
"three": "^0.144.0",
"use-sound": "^4.0.1",
"web-vitals": "^2.1.4"

[CodyJasonBennett]

I published a workaround in v1.0.3. Can you try another clean-install (remove lockfiles, node_modules)?

[CodyJasonBennett]

Alright, I bumped its-fine in v8.8.5 of react-three-fiber if you could try now.

[abhi-dasgupta]

yes everything is working now. Thank you for looking into it

[CodyJasonBennett]

@hakancunier let me know if there are any withstanding issues on your end. This looks to be resolved between CRA and vanilla Webpack with the work around from #14.

[hakancunier]

Hello. I got it working by upgrading react-scripts ^5.0.1. Thank you again.