ESLint 9.0大版本发布,配置文件大更新

前言

早在去年9月,ESLint官方博客就预告了9.0版本,弃用和删除了大量的API和规则,其中格式化规则的删除和旧配置文件eslintrc的弃用更改幅度最大。几个月测试下来,4月5日尘埃落定,9.0版本正式发布。

安装

在一切所用的eslint相关生态包升级适配9.0之前,不要尝试任何安装企图,不然报错是肯定的。

bash 复制代码
npm i eslint@9.0.0 --save-dev

迁移指南

由于更改东西很多,所以官方给了一份详细的迁移指南 eslint.org/docs/latest...

Node.js支持版本更新

众所周知Node.js每半年更新一次大版本,LTS和非LTS都会在一定的周期后停止支持,所以大部分库都会在一定时候弃用老版本Node.js,很显然这就是前端烦恼来源之一。

ESlint9.0支持的Node.js版本是LTSv18.18.0+和v20,不支持v19以及之前的所有版本。

Flat配置文件取代eslintrc文件

Flat 配置文件现在是 ESLint 的默认配置格式,并且 eslintrc 已正式弃用。要继续使用 eslintrc 配置文件,您需要将ESLINT_USE_FLAT_CONFIG环境变量设置为false

根据官方博客和上文的迁移指南所说,eslint.config.js为目前的默认配置文件,并且eslintrc文件支持将会在10.0版本时删除。

有关Flat配置文件的更多信息可以查看官方博客eslint.org/blog/2022/0... 和文档eslint.org/docs/latest...

主要不同就是CJS转到ESM,插件、解析器、规则继承和处理器等需要显式导入,其中一些不再支持按名称引用,添加了一些默认配置,同时对TS类型添加支持。详细参考配置文件迁移指南eslint.org/docs/latest...

删除了多个格式化程序

删除的格式化程序 替换的 npm 包
checkstyle eslint-formatter-checkstyle
compact eslint-formatter-compact
jslint-xml eslint-formatter-jslint-xml
junit eslint-formatter-junit
tap eslint-formatter-tap
unix eslint-formatter-unix
visualstudio eslint-formatter-visualstudio

如果您通过命令行标志使用任何这些格式化程序-f,则需要为格式化程序安装相应的软件包。

删除了valid-jsdocrequire-jsdoc规则

建议改用eslint-plugin-jsdoc插件。

删除了contextSourceCode中已弃用的方法

删除了context上弃用的方法并用SourceCode中的方法替换。 详情:eslint.org/blog/2023/0...

更新了eslint:recommended规则

已启用四项新规则:

此外,以下规则已删除:

请修复错误或禁用这些规则。

新规则:no-useless-assignment

一条新规则 ,no-useless-assignment旨在捕获已为变量赋值但该值从未被使用的情况。例如:

js 复制代码
let id = 1234;      // 1234 is never used
id = calculateId();

现有规则更新

  • complexity规则现在还考虑了解构模式和参数中的可选链接和默认值。
  • no-fallthrough规则有一个新选项reportUnusedFallthroughComment
  • no-inner-declarations规则具有新的默认行为。在 v8.x 中,该规则会将块内定义的任何函数标记为错误,因为此行为在 JavaScript 的早期版本中未定义。从 ES 2015 开始,块作用域函数声明已明确定义,因此我们更改了默认行为,不对块作用域函数发出警告。
  • no-misleading-character-class规则现在突出显示正则表达式中的违规字符,而不是整个正则表达式。
  • no-restricted-imports规则改变了paths的行为。在 v8.x 中,如果no-restricted-imports规则配置的paths数组中的多个条目具有相同的name属性,则只有最后一个条目适用。在 v9.0.0 中,所有条目均适用,允许为不同的导入名称指定不同的错误消息。
  • no-restricted-imports规则有新的选项allowImportNamesallowImportNamePattern
  • no-unused-vars规则的选项varsIgnorePattern不再适用于捕获的错误变量。
  • no-unused-vars规则的选项caughtErrors有一个新的默认值(从"none"更改为"all")。
  • no-unused-vars规则有一个新选项ignoreClassWithStaticInitBlock
  • no-useless-computed-key规则的选项enforceForClassMembers有一个新的默认值(从false更改为true)。这样做的目的是帮助避免重构时可能出现的误导性评论。当此选项设置为true时,如果案例永远不会失败,则规则将禁止失败评论。

新APIloadESLint()

ESLint 现在从其主入口导出了一个新函数 loadESLint()。集成可以使用该函数获取 ESLint 类(原 FlatESLint 类)或 LegacyESLint 类(原 ESLint 类),从而在 flat config 和 eslintrc API 之间轻松切换。 文档:eslint.org/docs/latest...

更严格的RuleTester验证

  • 消息不能有未替换的占位符。
  • 建议必须修改代码。
  • 测试用例output必须不同于code.
  • 测试错误对象必须指定messagemessageId
  • 测试错误对象必须指定suggestions实际错误是否提供建议。
  • 测试建议对象必须指定descmessageId
  • 测试建议对象必须指定output
  • filename测试对象的和only属性必须是预期类型(分别为stringboolean)。
  • 重复测试会导致错误。

--output-file命令现在保证输出文件

CLI--output-file命令旨在将 ESLint 运行的结果输出到指定文件。在此版本之前,如果检查通过且没有错误或警告,则不会输出任何文件。在 v9.0.0 中,当 linting 通过且没有任何错误或警告时,将输出一个空文件。

更好的范围分析

更新了 eslint-scope 的行为,修复了几个长期存在的错误:

  1. 以前,ESLint 会将("use strict")视为严格模式指令,尽管事实并非如此。现在修复了这个行为,因此只有有效的严格模式指令才会被遵从。
  2. extends子句的包含范围被错误地设置为包含该类的范围,而它本应是类范围本身。这已得到修复。

CodePath#currentSegments已删除

详细请看eslint.org/blog/2023/0...

预计算代码路径

ESLint v9.0.0 现在可在规则遍历之前预先计算代码路径信息。因此,无论在规则内部的哪个位置访问,代码路径信息现在都是完整的。

现在不允许同一规则包含多个 /* eslint */ 注释

在 ESLint v8.x,如果被标记的文件包含多个针对同一规则的 /* eslint */ 配置注释,最后一个注释将被应用,而其他注释将被静默忽略。

在 ESLint v9.0.0 中,第一个配置注释将被应用,而其他配置注释将被报告为 lint 错误。

改变规则的编写方式

进行了多项更改,以帮助防止规则出错:

  1. 函数式规则将在 v9.0.0 中停止运行。函数式规则是通过从文件导出函数而不是通过 create() 方法导出对象创建的规则。
  2. 如果规则没有指定 meta.schema,则会应用默认的 [] 模式。这意味着没有模式的规则将被假定为没有选项,这反过来又意味着如果提供了选项,验证将失败。
  3. 现在,RuleTester 会严格检查同一lint问题的建议信息是否唯一,并确保建议生成有效的语法。

--quiet选项性能更高

--quiet选项会隐藏 ESLint 控制台中的所有警告。在 v9.0.0 中,通过不执行任何设置为"warn"的规则来提高性能。

没有文件参数情况下运行eslint

如果您使用Flat配置并且没有将向CLI传递任何文件参数,则 CLI 将默认对当前目录进行 linting,这意味着您可以键入npx eslint并且它将正常工作。 (对 eslintrc 配置文件执行相同操作将导致错误。)

未使用的禁用指令默认会导致警告

一直以来,ESLint 都能标记未使用的禁用指令。在此版本中,默认启用了对未使用禁用指令的警告。你可以在配置文件中使用 linterOptions.reportUnusedDisableDirectives 或在命令行中使用 --report-unused-disable-directives-severity 来修改该值。

参考

官方博客:eslint.org/blog/2024/0...

相关推荐
不cong明的亚子8 天前
react项目中引入最新版本eslint
react.js·前端框架·eslint
下雪天的夏风21 天前
Vant 按需引入导致 Typescript,eslint 报错问题
前端·typescript·eslint
Kenny_Xu_001018542 个月前
【Web前端】vue3整合eslint约束代码格式
前端·vue·eslint
bigbig猩猩2 个月前
深入解析 ESLint 配置:从零到精通
javascript·eslint
SuperYing2 个月前
还在复制粘贴 eslint 配置?封装个预置函数,彻底解放你的双手
前端·eslint
昔冰_G2 个月前
报红:找不到名称ref ts(2304)、‘ref‘ is not defined. eslint(no-undef)
前端·typescript·vue·vue3·ts·eslint·自动导入
猫天意2 个月前
ESlint | 通过VsCode中的ESLint插件来实现自动修正语法错误
ide·vscode·编辑器·eslint·语法
Nicander3 个月前
eslint.config.js VS .eslintrc.*
前端·eslint
Dr_哈哈3 个月前
ESLint 9.0版本踩坑记录
vue.js·代码规范·eslint
天心天地生3 个月前
为微信小程序项目添加eslint
微信小程序·小程序·eslint