Error Message:
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it.
So I was googling this issue and had a LOT of problems finding a solution. So i would like to share it with you:
First of all this can happen not only with crypto but other stuff like http, https, os and so on.
Check if the packet (this case crypto-browserify is installed) There should be a folder node_modules\crypto-browserify
If it doesnt exist: npm install crypto browsrify, then yarn add @types/node@15.12.5 -D (for this node version)
In node_modules\crypto-browserify edit package.json and add
,
"optionalDependencies": {},
"browser": {
"crypto": false
},
(after devDependencies)
"compilerOptions": {
"paths":{
"crypto":["node_modules/crypto-browserify"],
"http":["node_modules/stream-http"],
"https":["node_modules/https-browserify"]
},
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"allowedCommonJsDependencies": ["crypto"],
"allowedCommonJsDependencies": ["http"],
"allowedCommonJsDependencies": ["https"],
I had this problem in ReactJS with create-react-app(facebook)
Solution:
First install the necessary packages "crypto-browserify"
Modify webpack.config.js in reactjs with create-react-app this file is inside:
node_modules/react-scripts/config/webpack.config.js
module.exports = function (webpackEnv) {
...
return {
...
resolve: {
...
fallback: {
// Here paste
crypto: require.resolve("crypto-browserify"),
}
}
}
}
Note:Is possible that need more packages, for example "stream-browserify" the steps are same. This solution works, but when the webpack project starts it shows warnings
Pd: I am not native speaker English, but I hope understand me.