reactjs - 故事书迁移到 CSF 的 Typescript 问题

Question

将 50 多个故事迁移到 CSF 后，它们不会出现在故事​​书中。经过一番挖掘后，我发现我必须将组件 key 传递给默认导出，组件的值是组件的值

export default {
title: "Title"
component: MyComponent
}

问题是我的所有组件都使用 Typescript，并且由于某种原因出现错误:

Default export of the module has or is using private name 'MyComponentProps'.ts(4082)

如有任何帮助，我们将不胜感激。

Answer 1

您可以像@Mayank 所建议的那样将它们的 props 更改为 type 而不是 interface，或者您可以简单地确保 export 它们的 Prop 。

例子:

interface Props {
  name: string;
}

const ({ name }: Props) => {
  return <div>{name}</div>;
}

如果您尝试为此组件创建一个故事，此代码将提供您获得的 TS4082。

如果导出接口(interface):

export interface Props {
  name: string;
}

const ({ name }: Props) => {
  return <div>{name}</div>;
}

错误将消失。