React 无效的钩子调用错误和故事书 6

Question

我的所有钩子都会导致无效的钩子调用错误，这是在使用安装故事书后发生的npx sb init

import React from 'react'
import { useSectionsQuery } from "../../graphql/generated";
          
export const Home: React.FC = () => {
  const { data } = useSectionsQuery();
            
  return (
    <div className="bg-gray-200">
                  
    
      <div style={{ backgroundColor: "#4267B2" }} className="grid grid-rows-1">
        <div className="flex justify-center">
          {data?.sectionMany.map((section: any) => {
            return <Card {...section} />;
          })}
        </div>
      </div>
    </div>
  )
}

Answer 1

对我来说的解决方案：

1. 我已经从 package.json 中删除了所有故事书依赖项；
2. 我已经删除了yarn.lock文件和node_modules文件夹；
3. 我已将 package.json 上的 React 和 React-dom 版本锁定为 16.13.1；
4. 我已将以下解决方案添加到我的 package.json 中：

  "resolutions": {
    "react": "^16.13.1",
    "react-dom": "^16.13.1"
  }

5. 我已经从 package.json 上的workspaces.nohoist 中删除了react 依赖项；
6. 我使用 npx sb init 从零开始安装 Storybook。

引用来自开发者的

@eric-burel，我们正在 6.1 中修改一堆这样的东西，比如 #11628，并且还删除了 webpack DLL，这也会导致大量的依赖敏感性

在这里阅读更多内容