javascript - React Redux 无法解析自己的模块

Question

当我为我的项目运行 webpack 时，我收到此错误提示 React-Redux 包无法解析其某些内部模块:

ERROR in ./node_modules/react-redux/es/index.js
Module not found: Error: Can't resolve './components/Context' in '/home/.../frontend/src/node_modules/react-redux/es'
 @ ./node_modules/react-redux/es/index.js 3:0-57 12:0-179
 @ ./index.tsx

ERROR in ./node_modules/react-redux/es/index.js
Module not found: Error: Can't resolve './components/Provider' in '/home/.../frontend/src/node_modules/react-redux/es'
 @ ./node_modules/react-redux/es/index.js 1:0-45 12:0-179
 @ ./index.tsx

ERROR in ./node_modules/react-redux/es/index.js
Module not found: Error: Can't resolve './components/connectAdvanced' in '/home/.../frontend/src/node_modules/react-redux/es'
 @ ./node_modules/react-redux/es/index.js 2:0-59 12:0-179
 @ ./index.tsx

ERROR in ./node_modules/react-redux/es/index.js
Module not found: Error: Can't resolve './connect/connect' in '/home/.../frontend/src/node_modules/react-redux/es'
 @ ./node_modules/react-redux/es/index.js 4:0-40 12:0-179
 @ ./index.tsx

ERROR in ./node_modules/react-redux/es/index.js
Module not found: Error: Can't resolve './hooks/useDispatch' in '/home/.../frontend/src/node_modules/react-redux/es'
 @ ./node_modules/react-redux/es/index.js 5:0-70 12:0-179 12:0-179
 @ ./index.tsx

ERROR in ./node_modules/react-redux/es/index.js
Module not found: Error: Can't resolve './hooks/useSelector' in '/home/.../frontend/src/node_modules/react-redux/es'
 @ ./node_modules/react-redux/es/index.js 6:0-70 12:0-179 12:0-179
 @ ./index.tsx

ERROR in ./node_modules/react-redux/es/index.js
Module not found: Error: Can't resolve './hooks/useStore' in '/home/.../frontend/src/node_modules/react-redux/es'
 @ ./node_modules/react-redux/es/index.js 7:0-61 12:0-179 12:0-179
 @ ./index.tsx

ERROR in ./node_modules/react-redux/es/index.js
Module not found: Error: Can't resolve './utils/batch' in '/home/.../frontend/src/node_modules/react-redux/es'
 @ ./node_modules/react-redux/es/index.js 8:0-41 11:0-8
 @ ./index.tsx

ERROR in ./node_modules/react-redux/es/index.js
Module not found: Error: Can't resolve './utils/reactBatchedUpdates' in '/home/.../frontend/src/node_modules/react-redux/es'
 @ ./node_modules/react-redux/es/index.js 9:0-79 11:9-14 12:0-179
 @ ./index.tsx

ERROR in ./node_modules/react-redux/es/index.js
Module not found: Error: Can't resolve './utils/shallowEqual' in '/home/.../frontend/src/node_modules/react-redux/es'
 @ ./node_modules/react-redux/es/index.js 10:0-48 12:0-179
 @ ./index.tsx

有人知道如何解决这个问题吗？会不会是因为我在redux之前安装了react-redux？如果是这样，我该如何解决。我已经尝试删除 package-lock.json 并删除 node_modules 并重新运行 npm install。我还深入研究了文件系统，发现文件系统上存在无法解析的模块；例如，即使 webpack 无法解析 ./components/Provider，文件 node_modules/react-redux/es/Provider.js 存在并且看起来很好。

这里是package.json的相关部分。会不会是版本不匹配之类的？

"devDependencies": {
    "@types/classnames": "^2.2.9",
    "@types/react": "^16.9.9",
    "@types/react-dom": "^16.9.1",
    "@types/react-redux": "^7.1.5",
    "@types/redux": "^3.6.0",
    "@typescript-eslint/eslint-plugin": "^2.4.0",
    "@typescript-eslint/parser": "^2.4.0",
    "eslint": "^6.5.1",
    "eslint-config-airbnb": "^18.0.1",
    "eslint-import-resolver-typescript": "^2.0.0",
    "eslint-plugin-import": "^2.18.2",
    "eslint-plugin-jsx-a11y": "^6.2.3",
    "eslint-plugin-react": "^7.16.0",
    "eslint-plugin-react-hooks": "^1.7.0",
    "prop-types": "^15.7.2",
    "react": "^16.10.2",
    "react-dom": "^16.10.2",
    "react-redux": "^7.1.1",
    "redux": "^4.0.4",
    "source-map-loader": "^0.2.4",
    "ts-loader": "^6.2.0",
    "typescript": "^3.6.4",
    "typescript-eslint": "0.0.1-alpha.0",
    "webpack": "^4.41.0",
    "webpack-cli": "^3.3.9"
  },
  "dependencies": {}

Answer 1

太棒了，我终于让它工作了!最后的诀窍是删除整个项目文件夹并从 GitHub 重新安装。安装的 node_modules 一定有问题，甚至 rm -rf 也无法修复。

---

编辑:我撒谎了。显然，当我删除项目并从 GitHub 重新加载它时，我不小心重置了我添加了所有 Redux 内容的提交，并且当我将其恢复时，错误也返回了。 实际上 发生的是我的 webpack.config.js 文件中的一个错误:

我得到的是 "extensions": [".ts", ".tsx"]

我需要的是 "extensions": [".ts", ".tsx", ".js"]

因此，即使 JS 文件在那里，Webpack 也会忽略它们，因为我的配置文件中缺少 ".js" 扩展名。添加这四个字符可以解决问题。这样就结束了长达数小时的调试过程。希望这可以帮助其他愚蠢到搞砸他们的 Webpack 配置然后尝试使用它来加载 React-Redux 的人。