深入理解 eslint-plugin-import 的 no-anonymous-default-export 规则

余达殉Lambert

于 2025-06-07 09:22:10 发布

阅读量272

点赞数 5

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/gitblog_00475/article/details/148490629

深入理解 eslint-plugin-import 的 no-anonymous-default-export 规则

eslint-plugin-import ESLint plugin with rules that help validate proper imports. 项目地址: https://gitcode.com/gh_mirrors/es/eslint-plugin-import

什么是匿名默认导出？

在 JavaScript ES6 模块系统中，开发者可以使用 export default 语法导出模块的默认值。然而，有时我们会直接导出匿名值，如匿名函数、对象字面量、数组字面量等，而不给它们命名。这就是所谓的"匿名默认导出"。

为什么需要禁止匿名默认导出？

eslint-plugin-import 的 no-anonymous-default-export 规则正是为了解决这个问题而设计的。它强制要求开发者为默认导出命名，主要基于以下几个原因：

代码可搜索性：命名导出使得在代码库中搜索特定模块变得更加容易。当导入和使用时，可以保持一致的标识符名称。
代码可读性：命名导出使代码意图更加清晰，便于其他开发者理解模块的功能。
调试友好性：在调试时，命名导出会显示有意义的名称，而不是匿名或自动生成的名称。
一致性维护：强制命名可以保持代码风格的一致性，特别是在团队协作项目中。

规则配置详解

该规则提供了细粒度的配置选项，允许开发者根据项目需求灵活调整：

{
  "rules": {
    "import/no-anonymous-default-export": ["error", {
      "allowArray": false,         // 是否允许数组字面量
      "allowArrowFunction": false, // 是否允许箭头函数
      "allowAnonymousClass": false, // 是否允许匿名类
      "allowAnonymousFunction": false, // 是否允许匿名函数
      "allowCallExpression": true, // 是否允许调用表达式(默认为true以保持向后兼容)
      "allowNew": false,          // 是否允许new表达式
      "allowLiteral": false,      // 是否允许字面量(数字、字符串等)
      "allowObject": false        // 是否允许对象字面量
    }]
  }
}

实际应用示例

不符合规则的代码示例

// 匿名数组导出
export default []

// 匿名箭头函数导出
export default () => {}

// 匿名类导出
export default class {}

// 匿名函数导出
export default function () {}

// 字面量导出
export default 123

// 对象字面量导出
export default {}

// new表达式导出
export default new Foo()

符合规则的代码示例

// 命名变量导出
const foo = 123
export default foo

// 命名类导出
export default class MyClass {}

// 命名函数导出
export default function foo() {}

// 配置允许数组导出后的写法
/* eslint import/no-anonymous-default-export: [2, {"allowArray": true}] */
export default []

// 配置允许箭头函数导出后的写法
/* eslint import/no-anonymous-default-export: [2, {"allowArrowFunction": true}] */
export default () => {}