首页  >  问答  >  正文

有没有办法使用 ESLint 强制将解构对象内联键入,而不是使用单独的类型定义?

我想强制我们始终内联键入解构对象,而不是创建单独的类型定义。例如,对于 React 组件,我想强制我们的所有代码都使用此模式:

const SomeComponent = ({ foo, bar }: { foo: string, bar: boolean }) => {
  return ...
}

而不是:

type Props = {
    foo: string, 
    bar: boolean,
};

const SomeComponent = ({ foo, bar }: Props} => {
  return ...
}

我查看了 ESLint 规则,没有找到类似的内容,有人有建议吗?

P粉445714413P粉445714413258 天前403

全部回复(1)我来回复

  • P粉530519234

    P粉5305192342024-02-27 18:49:03

    据我所知 - 目前没有强制执行此模式的现有 lint 规则。

    您可以使用 no-restricted-syntax 强制执行lint 规则 (示例),但是正如您帖子中的评论所暗示的那样 - 这不是一个好主意。

    不可能创建一个仅匹配“反应函数组件”的选择器,因为反应函数组件只是函数。因此(如我的示例所示)这种简单的方法会在您的代码库中产生大量噪音和误报 - 这很糟糕,因为它会给您的团队带来噪音。

    您可以通过创建自定义规则<来减少误报率< /a>,但是你永远无法真正让这个数字为零。


    顺便说一句 - 这种代码风格并不好,因为它违反了行业惯例。定义一个单独的类型是非常常见和流行的,这样它就可以被导入到消费者中并与其他类型组合在一起 - 例如在创建高阶或包装组件时。

    通过始终定义内联类型,您会变得更加困难,因为您别无选择,只能通过 Params<typeof MyComponent>[0] 来获取道具类型。

    回复
    0
  • 取消回复