故事书迁移到 CSF 的打字稿问题

Posted 2023-02-19

【中文标题】故事书迁移到 CSF 的打字稿问题

【英文标题】：Typescript problem with storybook migration to CSF

【发布时间】：2021-02-18 12:19:03

【问题描述】：

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

export default 
title: "Title"
component: MyComponent

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

模块的默认导出具有或正在使用私有名称 'MyComponentProps'.ts(4082)

对此的任何帮助将不胜感激。

【参考方案1】：

您可以将他们的道具更改为type 而不是interface，就像@Mayank 建议的那样，或者您可以简单地确保export 他们的道具。

例子：

interface Props 
  name: string;


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

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

如果导出接口：

export interface Props 
  name: string;


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

错误会消失。

【参考方案2】：

我假设您已经为 MyComponentProps 定义了一个接口。尝试将其更改为类型声明。这为我解决了问题。