Webpack 5不再对节点核心模块进行自动填充。 请问怎么修?
break CHANGE:默认情况下,webpack < 5用于为node.js核心模块包含polyfills。 现在情况已经不同了。验证你是否需要这个模块,并为它配置一个填充。
Webpack 5不再对节点核心模块进行自动填充。 请问怎么修?
break CHANGE:默认情况下,webpack < 5用于为node.js核心模块包含polyfills。 现在情况已经不同了。验证你是否需要这个模块,并为它配置一个填充。
当前回答
当我重新安装节点模块时,我的webpack当前版本是5.38.1,我已经修复了这个问题 安装后,你必须更新你的webpack.config.js resolve{} with 回退:{"fs": false, "path": require.resolve("path-browserify")}而不使用"fs": false它显示错误,即:模块未找到:错误:无法解析'fs'在'/YOUR DIRECTORY…' 所以别忘了加上它;与其他东西看起来像:
module.exports = {
...
resolve: {
extensions: [".js", ".jsx", ".json", ".ts", ".tsx"],// other stuff
fallback: {
"fs": false,
"path": require.resolve("path-browserify")
}
},
};
如果你的webpack.config.js文件中存在node属性,删除它
其他回答
当从webpack v4升级到v5时,我也得到了这些错误。 通过对webpack.config.js进行以下更改来解决
添加的决心。回退财产
删除节点属性
{
resolve: {
modules: [...],
fallback: {
"fs": false,
"tls": false,
"net": false,
"path": false,
"zlib": false,
"http": false,
"https": false,
"stream": false,
"crypto": false,
"crypto-browserify": require.resolve('crypto-browserify'), //if you want to use this module also don't forget npm i crypto-browserify
}
},
entry: [...],
output: {...},
module: {
rules: [...]
},
plugins: [...],
optimization: {
minimizer: [...],
},
// node: {
// fs: 'empty',
// net: 'empty',
// tls: 'empty'
// },
}
从v4升级到v5 => https://webpack.js.org/migrate/5/#clean-up-configuration
NPM install path-browserify 然后尝试更改webpack配置以包括:
module.exports = {
...
resolve: {
alias: {
path: require.resolve("path-browserify")
}
}
};
我从express导入路由器时得到这个错误 import {Router} from 'express';
修正后解决 import {Router} from '@angular/ Router ';
对我来说,我只是删除了一个未使用的导入,称为:
import res from "express/lib/response"
它把它修好了!
方法1
开放项目/ node_modules react-scripts / config / webpack.config.js 在回退中添加"crypto": require.resolve("crypto-browserify")
resolve: {
fallback: {
"crypto": require.resolve("crypto-browserify")
}
}
安装npm i crypto-browserify 重新启动应用程序。
如果你提交,上面的方法是无效的,因为我们不是node_modules
方法2
安装补丁包:纱线添加补丁包 安装所需的填料。(做一个应用程序的初始构建,它会告诉你。) 修改node_modules / react-scripts / config / webpack.config.js。举个例子。这是从Webpack的文档中截取的。
module.exports = {
//...
resolve: {
fallback: {
assert: require.resolve('assert'),
buffer: require.resolve('buffer'),
console: require.resolve('console-browserify'),
constants: require.resolve('constants-browserify'),
crypto: require.resolve('crypto-browserify'),
domain: require.resolve('domain-browser'),
events: require.resolve('events'),
http: require.resolve('stream-http'),
https: require.resolve('https-browserify'),
os: require.resolve('os-browserify/browser'),
path: require.resolve('path-browserify'),
punycode: require.resolve('punycode'),
process: require.resolve('process/browser'),
querystring: require.resolve('querystring-es3'),
stream: require.resolve('stream-browserify'),
string_decoder: require.resolve('string_decoder'),
sys: require.resolve('util'),
timers: require.resolve('timers-browserify'),
tty: require.resolve('tty-browserify'),
url: require.resolve('url'),
util: require.resolve('util'),
vm: require.resolve('vm-browserify'),
zlib: require.resolve('browserify-zlib'),
},
},
};
不要添加所有的,只添加你需要的。
在修改webpack之前,请确保先安装这些包 配置。
运行yarn patch-package react-scripts。这将生成一个补丁(这应该在你的回购中提交)。 向包中添加postinstall脚本。Json: "postinstall": "yarn patch-package"。现在,任何时候,有人在这个项目上安装npm deps,都会自动应用你在步骤3中创建的补丁。
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"postinstall": "yarn patch-package"
},