未捕获的类型错误:Object(..) 不是更新 webpack resolve.modules 后的函数

Question

为了使用Typescript获得绝对导入，我在tsconfig中添加了baseUrl，并将modules添加到webpack.config.js的resolve部分。它来自：

resolve: {
// Add '.ts' and '.tsx' as resolvable extensions.
extensions: [".ts", ".tsx", ".js", ".json", ".jsx"]
},

自

resolve: {
// Add '.ts' and '.tsx' as resolvable extensions.
extensions: [".ts", ".tsx", ".js", ".json", ".jsx"],
modules: [
path.resolve(__dirname, "./src/main/resources/static/")
]
},

但是，一旦我这样做了，webpack 就不再解析从node_modules导入，所以我将其更新为：

resolve: {
// Add '.ts' and '.tsx' as resolvable extensions.
extensions: [".ts", ".tsx", ".js", ".json", ".jsx"],
modules: [
path.resolve(__dirname, "./src/main/resources/static/"),
path.resolve("./node_modules")
]
},

之后，我开始在我正在处理的页面上的控制台中出现以下异常：

Uncaught TypeError: Object(...) is not a function
at Module../node_modules/@reduxjs/toolkit/dist/redux-toolkit.esm.js (index.ts:17)
at __webpack_require__ (bootstrap:19)
at bootstrap:83
at bootstrap:83
./node_modules/@reduxjs/toolkit/dist/redux-toolkit.esm.js   @   index.ts:17
__webpack_require__ @   bootstrap:18
(anonymous) @   bootstrap:82
(anonymous) @   bootstrap:83

Answer 1

就我而言，这是由于 webpack 解析了 redux 工具包导入的错误版本的immer。在根node_modules下，我看到immer版本 5 并嵌入其中node_modules/@reduxjs/toolkit我看到另一个包含immer版本 7 的node_modules。我发现 webpack 解析了错误的版本，因为我在我的 webpack 配置中resolve下添加了modules键。如文档中所述，modules的默认值为["node_modules"]。 我添加了脚本的根路径以启用绝对导入，然后包含根node_modules以启用常规的外部依赖项导入，但是由于忽略了在resolve.modules中仅包含"node_modules"，从而阻止了 webpack 使用嵌入式node_modules目录解析导入。最终得到了这个，它再次起作用：

resolve: {
// Add '.ts' and '.tsx' as resolvable extensions.
extensions: [".ts", ".tsx", ".js", ".json", ".jsx"],
modules: [
path.resolve(__dirname, "./src/main/resources/static/"),
"node_modules",
]
},