ESLint no-trailing-spaces 規則完全指南禁止行尾尾隨空白并自動修復【免費下載鏈接】eslintFind and fix problems in your JavaScript code.項目地址: https://gitcode.com/GitHub_Trending/es/eslint在代碼編輯過程中行尾經常會殘留多余的空格或制表符。這些不可見的尾隨空白雖然不會引發任何功能問題卻會被版本控制系統捕捉為無關的 diff干擾代碼評審也讓許多團隊的編碼規范在提交前強制要求清理。ESLint 內置的no-trailing-spaces規則正是為了解決這一痛點而設計它負責檢測并清除每行末尾的多余空白字符并支持通過--fix一鍵自動修復。本文將圍繞 docs/src/rules/no-trailing-spaces.md 文檔結合本倉庫中的規則實現與測試用例完整講解該規則的用法、兩個配置選項的語義以及它在源碼層面的工作原理。規則概述禁止行尾尾隨空白no-trailing-spaces是一條layout布局類型規則其核心職責是禁止行尾出現尾隨空白字符trailing whitespace包括空格、制表符Tab以及其他 Unicode 空白字符。規則元數據定義在 lib/rules/no-trailing-spaces.js 中module.exports { meta: { type: layout, fixable: whitespace, docs: { description: Disallow trailing whitespace at the end of lines, recommended: false, }, messages: { trailingSpace: Trailing spaces not allowed., }, // ... }, };幾個值得注意的關鍵信息fixable: whitespace該規則支持自動修復運行eslint --fix時可直接刪除行尾的尾隨空白無需人工逐行清理。recommended: false該規則不在 ESLint 的推薦配置集中需要顯式開啟。默認消息Trailing spaces not allowed.觸發時會在報告中顯示該 messageId。該規則屬于舊版核心規則其元數據中標注了deprecatedSince: 8.53.0、availableUntil: 11.0.0自 ESLint v8.53.0 起核心格式化類規則逐步遷移至stylistic/eslint-plugin見 lib/rules/no-trailing-spaces.js 中的replacedBy字段。本文當前倉庫中的實現仍完整可用。規則詳解與代碼示例規則的觸發條件是一行代碼的末尾存在空白字符空格、Tab 或 Unicode 空白字符。不正確的代碼示例以下代碼在每行末尾都帶有多余的空格均會被該規則報告/*eslint no-trailing-spaces: error*/ var foo 0;/* trailing whitespace */ var baz 5;/* trailing whitespace */ /* trailing whitespace */正確的代碼示例當行尾沒有任何空白時代碼通過檢查/*eslint no-trailing-spaces: error*/ var foo 0; var baz 5;需要特別說明的是尾隨空白的判定對象是文本行末尾即行尾換行符之前的所有空白。因此行首縮進、行中空白都不會被誤報只有緊貼行尾的空白才會命中。配置選項Options該規則接受一個對象選項包含兩個布爾配置項選項類型默認值含義skipBlankLinesbooleanfalse默認不允許空行上的尾隨空白設為true后允許空行僅含空白的行保留尾隨空白ignoreCommentsbooleanfalse默認不允許注釋塊中的尾隨空白設為true后允許注釋區域內的尾隨空白這兩個選項在源碼中通過如下方式解析見 lib/rules/no-trailing-spaces.jsconst options context.options[0] || {}, skipBlankLines options.skipBlankLines || false, ignoreComments options.ignoreComments || false;同時規則的schema見 lib/rules/no-trailing-spaces.js會對配置做嚴格校驗skipBlankLines與ignoreComments都必須是布爾類型且不允許出現未聲明的額外屬性additionalProperties: false配置寫錯時 ESLint 會直接拋出配置校驗錯誤而不是靜默忽略。skipBlankLines是否放行空行skipBlankLines決定整行只有空白無任何代碼或注釋時是否報錯。默認false下一個只含空格的空行會被視為違規設為true后這類空白行被允許。/*eslint no-trailing-spaces: [error, { skipBlankLines: true }]*/ var foo 0; var baz 5; // ↓ a line with whitespace only ↓該選項對以空白填充來分隔代碼塊的格式化風格非常實用例如很多團隊習慣在函數之間用帶縮進的空行分組此時開啟skipBlankLines: true可以避免大量誤報。ignoreComments是否放行注釋區域ignoreComments決定注釋所在的行包括單行注釋//、多行注釋/* */、以及 shebang 行上的尾隨空白是否被忽略。默認false會檢查注釋行設為true后注釋區域內的尾隨空白不再報告/*eslint no-trailing-spaces: [error, { ignoreComments: true }]*/ // ↓ these comments have trailing whitespace → // /** * baz * * bar */從實現上看該選項的判斷邏輯是先收集所有注釋節點覆蓋的行號集合getCommentLineNumbers見 lib/rules/no-trailing-spaces.js其中塊注釋Block會覆蓋從起始行到end.line - 1的全部行行注釋Line只覆蓋自身所在行隨后當某一行命中尾隨空白時若ignoreComments為真且該行號在注釋行集合中則跳過不報見 lib/rules/no-trailing-spaces.js。值得注意的是ignoreComments: true只豁免注釋本身所在的行如果一行是注釋后跟代碼如/* */foo行尾空白依然會被報告這一點在測試用例中也有覆蓋見 tests/lib/rules/no-trailing-spaces.js。源碼實現原理基于正則的文本掃描該規則沒有依賴 AST 節點的遍歷而是在Program節點上對源碼文本做正則匹配。源碼中的注釋說明了原因見 lib/rules/no-trailing-spaces.jsEspree does not return whitespace nodes, fetch the source code and do matching via regexps.ESLint 的解析器不會產出空白節點因此該規則直接讀取sourceCode.lines按行分割的文本數組逐行執行正則匹配。核心正則定義如下見 lib/rules/no-trailing-spaces.jsconst BLANK_CLASS [ \t\u00a0\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u200b\u3000], SKIP_BLANK ^${BLANK_CLASS}*$, NONBLANK ${BLANK_CLASS}$;BLANK_CLASS是一個字符類覆蓋了空格、制表符\t、不間斷空格\u00a0、Unicode 空格族\u2000~\u200b以及全角空格\u3000NONBLANK[...]$用于匹配行尾的非空空白序列是主要的檢測正則SKIP_BLANK^[...]*$用于判斷某行是否為純空白行供skipBlankLines選項使用。掃描過程中的幾個實現細節值得了解行號與列號計算每行的列范圍從matches.index首個尾隨空白的位置到行尾由于修復時需要精確刪除空白區間代碼還會把每行的長度累加為totalLength將行列號換算成全局字符區間range最終通過fixer.removeRange(fixRange)刪除空白見 lib/rules/no-trailing-spaces.js。CRLF 兼容計算行范圍時會把換行符本身也計入\r\n長度為 2、\n長度為 1確保在 Windows 的 CRLF 換行文件上修復結果也不會破壞行結構見 lib/rules/no-trailing-spaces.js。測試用例中專門構造了\r\n混合換行的場景來驗證見 tests/lib/rules/no-trailing-spaces.js。模板字符串TemplateLiteral豁免如果尾隨空白位于模板字符串內部通過sourceCode.getNodeByRangeIndex定位到TemplateElement且區間完全落在模板內則該行不會被報告見 lib/rules/no-trailing-spaces.js。這是為了避免破壞模板字符串中的空白內容——測試用例let str \${a}\n \n$; 驗證了這一點見 tests/lib/rules/no-trailing-spaces.js。實戰配置建議在 flat configeslint.config.js中啟用當前倉庫采用 flat config 體系啟用該規則的典型寫法如下// eslint.config.js export default [ { rules: { no-trailing-spaces: [error, { skipBlankLines: false, ignoreComments: false }], }, }, ];若希望保留空白行分隔又不誤報可將skipBlankLines設為true若希望注釋區域不受打擾可將ignoreComments設為true。與 --fix 結合使用由于規則聲明了fixable: whitespace直接運行npx eslint --fix .即可讓 ESLint 自動清除所有行尾的尾隨空白無需人工逐行處理這也是將該規則納入 CI 或 pre-commit 鉤子的常見做法。總結no-trailing-spaces是一個簡單卻高頻實用的布局規則默認嚴格禁止行尾的一切尾隨空白空格、Tab、Unicode 空白通過skipBlankLines與ignoreComments兩個布爾選項可以靈活豁免純空白行與注釋區域并憑借fixable: whitespace支持--fix自動清理。其底層實現不依賴 AST 遍歷而是用精心構造的 Unicode 空白字符類對源碼逐行做正則掃描同時妥善處理了 CRLF 換行、模板字符串與注釋行號等邊界情況。相關實現與測試可在 lib/rules/no-trailing-spaces.js 與 tests/lib/rules/no-trailing-spaces.js 中繼續深入閱讀。另外提醒一點該規則在 ESLint 核心中的生命周期已進入棄用階段自 v8.53.0 起長期維護可關注其遷移方向但當前倉庫版本中的功能依然完整可用。【免費下載鏈接】eslintFind and fix problems in your JavaScript code.項目地址: https://gitcode.com/GitHub_Trending/es/eslint創作聲明：本文部分內容由AI輔助生成（AIGC），僅供參考