I created a fresh create-react-app template and built the project with npm run build command and got this error. I ejected react-scripts and i looked for reason why it isn't it building, but i didn't find anything. i've fixed css files imports in components. node version 16.13.2, npm version 8.1.2
/home/pawel/projekty/hashcode/config/webpack.config.js:623
new MiniCssExtractPlugin({
^
TypeError: MiniCssExtractPlugin is not a constructor
at module.exports (/home/pawel/projekty/hashcode/config/webpack.config.js:623:9)
at Object.<anonymous> (/home/pawel/projekty/hashcode/scripts/build.js:51:16)
at Module._compile (internal/modules/cjs/loader.js:1063:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12)
at internal/main/run_main_module.js:17:47
and this is ejected webpack config https://github.com/PSmigielski/hashcode/blob/master/config/webpack.config.js
This seems to be a new issue that came out recently and an issue has been opened with the create-react-app repository.
https://github.com/facebook/create-react-app/issues/11930
The two workarounds right now seem to be these
1.) Pinning the mini css extract version:
npm i -D --save-exact mini-css-extract-plugin@2.4.5
2.) Adding a resolutions to the package.json works as well:
"resolutions": {
"mini-css-extract-plugin": "2.4.5"
}