Latest version of Autoprefixer throwing error
ashleighc207 opened this issue · 9 comments
When updating my React app to the latest version of Autoprefixer, I get the following error:
Error: No valid exports main found for '.../node_modules/colorette'
package.json:
"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.3.2",
"@testing-library/user-event": "^7.1.2",
"autoprefixer": "^9.8.6",
"aws-amplify": "^3.0.23",
"aws-amplify-react": "^4.1.22",
"axios": "^0.19.2",
"colorette": "^1.2.0",
"cross-env": "^7.0.2",
"escalade": "^3.0.2",
"lodash": "^4.17.20",
"react": "^16.13.1",
"react-app-polyfill": "^1.0.6",
"react-dom": "^16.13.1",
"react-router-dom": "^5.2.0",
"react-scripts": "^3.4.3"
},Node v: 14.6
This is fixed by reverting Autoprefixer to v9.8.0. Is there something I need to change to make the latest work?
Does it happen during the runnig unit test or during the build?
Happens when I run react-scripts start
Sorry, I am not a CRA user and right now in the trip and can't look CRA docs. Is it starting the development server?
Very strange. This error happens on Node.js 13 because of ESM bug. Can you double check that you do not use Node.js 13?
Another reason is ESM bug in Create React App. I sent PR to fix it, but they refuse to release it yet. But this bug could happen only during the unit test.
Development server is running which throws the error. If i revert the package to @9.8.0 it fixes the issue and after reloading, the screen loads normally.
When I change to @9.8.6 and reload the screen, the error appears.
I'm using nvm to change node (was on 14.8, dropped to 14.6 based on some answers I found online but it didn't help)
confirmed when I run node -v:
node -v
v14.6.0
Reverted to 9.8.6 for the full error:
Failed to compile.
./src/index.css (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??postcss!./src/index.css)
Error: No valid exports main found for '.../node_modules/colorette'
Found this posted on the create-react-app github which is the steps I tried
facebook/create-react-app#9273
In 9.8.6 we switched tocolorette library for color output. We use color output only in free places, but next PostCSS 8 will anyway use the same library. Unfortunately, the problem is that colorette does ESM export according to Node.js recommendation.
Can you create a small repo to reproduce the error? I will try to look.
Found this posted on the create-react-app github which is the steps I tried
facebook/create-react-app#9273
In that issue all people have the issue because of using Node.js 13.
Ah sorry totally user error! You were right, somehow was still on v13 on my terminal that was running the server. Thank you for the quick responses!
It happens 👍