ARTICLE DETAIL

资讯详情

深耕网站建设、视觉设计与SEO优化的一线实战洞察。

ESLint space-after-keywords 规则全解析:历史、配置与 keyword-spacing 迁移指南

ESLint space-after-keywords 规则全解析:历史、配置与 keyword-spacing 迁移指南 ESLint space-after-keywords 规则全解析历史、配置与 keyword-spacing 迁移指南【免费下载链接】eslintFind and fix problems in your JavaScript code.项目地址: https://gitcode.com/GitHub_Trending/es/eslintspace-after-keywords是 ESLint 早期版本中的一条布局类规则用于强制关键字如if、else、for、while之后的空格风格保持一致。本文将以 docs/src/rules/space-after-keywords.md 为骨架完整还原该规则的配置方式与正反示例并结合本仓库中的替换映射、规则元数据与替代规则源码说明它在 ESLint v2.0.0 中被 keyword-spacing 取代的前因后果以及如何在现代 ESLint 配置中无缝迁移。读完本文你将掌握这条历史规则的全部行为细节并能在现行 ESLint 版本中通过keyword-spacing实现完全等价的约束。规则背景什么是 space-after-keywordsspace-after-keywords的目标是强制关键字后的空格保持一致。JavaScript 中有不少关键字是语法结构的起点例如if、else、for、while等。不同的代码风格指南对这类关键字的间距有着截然不同的要求有的要求在关键字之后保留至少一个空格if (a)有的则要求关键字后不留空格if(a)。space-after-keywords正是为统一这种风格而设计的。从原文档的示例可以看出规则关心的差异点if (condition) { doSomething(); } else { doSomethingElse(); } if(condition) { doSomething(); }else{ doSomethingElse(); }第一段if (condition)、} else {是关键字后带空格的风格第二段if(condition)、}else{则是关键字后不带空格的风格。该规则会检查项目代码确保全项目统一采用其中一种。Rule Details规则检查范围与选项检查的关键字集合根据原文档space-after-keywords会对以下关键字之后的间距进行一致性检查if、else、for、while、do、switch、try、catch、finally、with这一集合覆盖了 JavaScript 中绝大多数作为语句或控制结构开头的关键字但不包含function、return、var等这些关键字的前后间距由其他规则负责例如姊妹规则space-before-keywords负责检查关键字之前的间距space-before-keywords 覆盖了if、else、for、while、do、switch、throw、try、catch、finally、with、break、continue、return、function、yield、class、变量声明let/const/var以及标签语句。选项单一字符串参数该规则只接受一个参数选项值行为默认值always关键字之后必须至少有一个空格✅ 默认值never关键字之后不允许有任何空格—需要注意原文档明确指出默认值为always。也就是说在 ESLint v2.0.0 之前如果你开启space-after-keywords但未显式传参那么if(a) {}这种写法会被判定为错误。默认配置下的错误示例使用默认always时以下代码均为错误代码/*eslint space-after-keywords: error*/ if(a) {} if (a) {} else{} do{} while (a);逐行分析if(a) {}if关键字后紧跟(缺少空格else{}else关键字后紧跟{缺少空格do{}do关键字后紧跟{缺少空格。never 配置下的错误示例当显式配置为never时关键字后不允许存在空格因此带空格的写法反而成为错误/*eslint space-after-keywords: [error, never]*/ if (a) {}这里的if与(之间的空格即为违规点。正确示例默认always下的正确代码/*eslint space-after-keywords: error*/ if (a) {} if (a) {} else {}never下的正确代码/*eslint space-after-keywords: [error, never]*/ if(a) {}与 space-before-keywords 的分工与协作space-after-keywords负责关键字后的空格其姊妹规则 space-before-keywords 负责关键字前的空格。两者共同构成了早期 ESLint 对关键字间距的完整约束。space-before-keywords同样只接受always默认或never两个参数always关键字前必须有至少一个空格never关键字前不允许有空格仅作用于else、whiledo...while、finally、catch四个关键字。值得注意的是space-before-keywords会允许关键字前出现左花括号{例如}else {}中else前的}不属于违规。如果项目希望对这种场景做更细粒度的控制需要配合 block-spacing 规则使用。此外space-before-keywords在原文档中标注为(fixable)——即该规则报告的问题可以通过 ESLint 命令行--fix选项自动修复相关 CLI 用法见 command-line-interface 中的--fix说明。这印证了早期 ESLint 已经具备对这类间距规则的自动修复能力。为何被移除v2.0.0 中被 keyword-spacing 全面取代原文档开头的:::important提示非常明确This rule was removed in ESLint v2.0.0 and replaced by the keyword-spacing rule.也就是说这条规则在 ESLint v2.0.0 中被移除其职责由 keyword-spacing 承担。仓库中有多处证据可以印证这一替换关系替换映射表conf/replacements.json 中明确登记了规则替换关系space-after-keywords: [keyword-spacing], space-before-keywords: [keyword-spacing], space-return-throw-case: [keyword-spacing]可以看到不仅space-after-keywordsspace-before-keywords与space-return-throw-case也一并被合并进了keyword-spacing。规则元数据conf/rule-type-list.json 与 docs/src/_data/rules.json 中都以removed标记了space-after-keywords并记录replacedBy指向keyword-spacing。官方迁移指南docs/src/use/migrating-to-2.0.0.md 中同样明确写道space-after-keywordsis replaced bykeyword-spacing。这也解释了为何lib/rules/目录下不存在space-after-keywords.js实现文件——该规则源码随 v2.0.0 的移除而删除现代 ESLint 代码库中只保留了keyword-spacing的实现见 lib/rules/keyword-spacing.js。迁移实战用 keyword-spacing 实现等价约束keyword-spacing把原来分散在space-after-keywords、space-before-keywords、space-return-throw-case三条规则中的能力统一了起来同时提供了更细粒度的对象选项。其选项结构如下before: true默认要求关键字前至少有一个空格before: false禁止关键字前有空格after: true默认要求关键字后至少有一个空格after: false禁止关键字后有空格overrides允许针对指定关键字单独覆盖间距风格从 always 迁移原space-after-keywords: [error, always]默认行为等价于keyword-spacing的默认配置{ after: true }。也就是说只要开启keyword-spacing并保持默认选项if(a) {}这类关键字后无空格的写法就会被自动拦截/*eslint keyword-spacing: [error, { after: true }]*/ if(foo) { // ✗ 错误if 后缺少空格 // ... } else if(bar) { // ✗ 错误if 后缺少空格 // ... } else{ // ✗ 错误else 后缺少空格 // ... }正确写法如下/*eslint keyword-spacing: [error, { after: true }]*/ if (foo) { // ... } else if (bar) { // ... } else { // ... }从 never 迁移原space-after-keywords: [error, never]等价于keyword-spacing的{ after: false }配置此时关键字后不允许出现空格/*eslint keyword-spacing: [error, { after: false }]*/ if(foo) { // ✓ 正确 // ... } else if(bar) { // ✓ 正确 // ... } else{ // ✓ 正确 // ... }而带空格的if (foo) {写法在该配置下会报错。按关键字定制overrideskeyword-spacing相比旧规则的最大增强在于overrides选项它允许为不同关键字设置不同的空格策略。例如下面这个配置只对if、for、while、static、as五个关键字关闭关键字后的空格/*eslint keyword-spacing: [error, { overrides: { if: { after: false }, for: { after: false }, while: { after: false }, static: { after: false }, as: { after: false } } }]*/ if(foo) { // ... } else if(bar) { // ... } else { // ... } for(;;); while(true) { // ... } class C { static{ // ... } } export { C asmy class };这种能力是旧的space-after-keywords仅支持单一always/never参数所不具备的。覆盖面对比新规则的检查范围更广space-after-keywords只检查 10 个关键字而keyword-spacing的检查范围大幅扩展。根据 keyword-spacing 文档与 lib/rules/keyword-spacing.js 的源码实现其KEYS数组在基础关键字之外又加入了as、async、await、from、get、let、of、set、yield等新规则覆盖了模块声明中的as/from、async 函数中的async/await、for-in/for-of 中的in/of、getter/setter 中的get/set等关键字及类关键字 token全面覆盖了现代 JavaScript 语法。同时该规则的设计刻意避免与其他间距规则冲突它不检查那些由array-bracket-spacing、arrow-spacing、block-spacing、comma-spacing、computed-property-spacing、generator-star-spacing、key-spacing、object-curly-spacing、semi-spacing、space-in-parens、space-infix-ops、space-unary-ops、yield-star-spacing、jsx-curly-spacing、func-call-spacing、space-before-function-paren等规则负责的间距场景避免规则之间互相重叠报告。When Not To Use It原文档最后给出了何时不使用的结论如果你不希望强制关键字间距的一致性那么可以放心关闭该规则在新版本中即关闭keyword-spacing。关键字间距本质上属于风格约定而非正确性问题不同团队完全可以有不同偏好甚至交由prettier等格式化工具统一处理。延伸阅读替代规则完整文档keyword-spacing姊妹规则同样已被移除space-before-keywords规则替换映射表conf/replacements.json规则元数据removed/replacedByconf/rule-type-list.json、docs/src/_data/rules.jsonv2.0.0 迁移指南docs/src/use/migrating-to-2.0.0.md当前实现源码lib/rules/keyword-spacing.js【免费下载链接】eslintFind and fix problems in your JavaScript code.项目地址: https://gitcode.com/GitHub_Trending/es/eslint创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表