如何修复ESLINT错误：＆＃x27;默认值＆＃x27;被限制不受我的反应打字条项目中的导出名称

Question

我正在更新我的React项目中的ESLINT规则。

目前，我在扩展属性中eslintrc.js：

extends: [
    'airbnb',
    'airbnb-typescript',
    'airbnb/hooks',
    // "plugin:@typescript-eslint/recommended",
    // "plugin:@typescript-eslint/recommended-requiring-type-checking",
    // "plugin:eslint-comments/recommended",
    'plugin:react/recommended',
    'plugin:jest/recommended',
    'plugin:prettier/recommended',
  ],

我遇到此错误：

错误'默认值'被限制被用作导出名称 无限制的出口

我们对组件的模式是这样的：

Button/
 - Button.tsx
 - Button.spec.ts
 - Button.stories.tsx
 - index.ts

index.ts：

从'./button'export {default} export {default};

如何解决这个问题？还是我必须以某种方式覆盖这个Eslint规则？

Answer 1

您需要禁用此规则 - 无限制的exports。
您的.eslintrc文件将在这里看起来像这样

{
  "extends": [
    'airbnb',
    'airbnb-typescript',
    'airbnb/hooks',
    // "plugin:@typescript-eslint/recommended",
    // "plugin:@typescript-eslint/recommended-requiring-type-checking",
    // "plugin:eslint-comments/recommended",
    'plugin:react/recommended',
    'plugin:jest/recommended',
    'plugin:prettier/recommended',
  ],
  "rules": {
    "no-restricted-exports": 0,
  }
}

的文档 - htttps：htttps：// eslint。 org/doc/最新/规则/无限制的exports 。

另一个选项是不使用默认导出，而是执行这样的操作：

export const Button = () => {...};

在index.ts文件中：

export * from './Button';