有没有办法使用 ESLint 强制将解构对象内联键入,而不是使用单独的类型定义?
P粉445714413
P粉445714413 2024-02-26 20:05:49
0
1
465

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

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

而不是:

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

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

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

P粉445714413
P粉445714413

全部回复(1)
P粉530519234

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

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

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

您可以通过创建自定义规则,但是你永远无法真正让这个数字为零。


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

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

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板