如何配置ESLint，使其不允许默认导出

Question

我已经在网络和StackOverflow搜索了很长一段时间，但没有成功。

我要做的是让ESLint将以下标记为错误：

export default ...;

default是这里的关键。到目前为止，我得到的最好的参考是eslint-plugin-import插件及其一些规则，这些规则可以使我更接近目标，即不匿名-默认-导出规则。但是，即使有了这条规则，下列默认导出仍然有效：

const foo = 123
export default foo

export default class MyClass() {}

export default function foo() {}

我如何配置ESLint，使这四个也会被认为是错误？

Answer 1

如果您已经在使用eslint-plugin-import，则可以使用no-default-export规则(该规则是在2018年2月左右添加的)。

Answer 2

您可以使用规则来完成这个任务。尝试在演示中粘贴它以尝试它(在选项中首先需要将"Source“更改为"module”)：

/* eslint "no-restricted-syntax": ["error", {
    "selector": "ExportDefaultDeclaration",
    "message": "Prefer named exports"
  }] */
export default class Foo { } // 5:1 - Prefer named exports (no-restricted-syntax)

Answer 3

由于它已经在接受的答案中得到了回答，值得一提的是在Next.js项目中工作时，我喜欢这样做：

'import/no-default-export': 'error',
overrides: [
  {
    files: ['src/pages/**/*'],
    rules: {
      'import/no-default-export': 'off',
    },
  },
],

其中唯一的异常是路由页，这些页面必须在Next.js中默认导出。