NextJS 14 / React 18 升级后错误：TypeError：无法访问属性“useState”，调度程序为 null

Question

我正在使用一个 NextJS 应用程序，该应用程序最近从 NextJS 12 升级到 14，并将 React 从 16 升级到 18...以及一堆其他库。走了一趟，所有的东西都升级了。

我在前端收到以下错误（但在 SSR 上没有）。

TypeError: can't access property "useState", dispatcher is null

const UseModal = () => {
> 4 |   const [isActive, setIsActive] = useState<boolean>(false);

以及其他地方：

TypeError: can't access property "useEffect", dispatcher is null

Google 和 openai 告诉我，我可能有多个版本的 React。

但是，我在 Yarn 4 中使用

resolutions

package.json

字段，并且相信我已经确保情况并非如此：

yarn info react
└─ react@npm:18.3.1
   ├─ Version: 18.3.1
   │
   └─ Dependencies
      └─ loose-envify@npm:^1.1.0 → npm:1.4.0

yarn info react-dom
└─ react-dom@npm:18.3.1
   ├─ Instances: 1
   ├─ Version: 18.3.1
   │
   └─ Dependencies
      ├─ loose-envify@npm:^1.1.0 → npm:1.4.0
      └─ scheduler@npm:^0.23.2 → npm:0.23.2

对于这个问题有什么想法吗？参考资料，还是想法？我感觉被困住了。谢谢你。

Answer 1

我解决了这个问题。我有一个嵌套项目，它依赖于react和react-dom。我将其更改为对等依赖，如下所示：

  "peerDependencies": {
    "@types/react": "^18.3.3",
    "@types/react-dom": "^18.3.3",
    "react": "^18.3.1",
    "react-dom": "^18.3.1"
  },

我现在记得将其移出

peerDependencies

来修复一个测试版本，该版本要求所有 deps 都位于 node_modules 中...已经进行了一两个月的升级。

我没想到相同版本的嵌套依赖项会生成一个单独的 React 实例......wtf。

还有其他人对 JS 包管理和构建生态系统的现状感到不知所措吗？ ✋🏼