在之前的文章中有分享過 Vite 是首個接入 AI 能力的構建工具，而現在 ESLint 也緊隨其后，使用 AI 來管理代碼規范！

作為一名前端開發，咱們平時寫代碼的時候，代碼規范這事兒一直挺讓人頭疼的吧。

不過現在好消息來了！ESLint 這工具居然也開始用 AI 了，以后咱們可以讓 AI 幫著管代碼規范了！

一、ESLint 為啥要用 AI ？

ESLint 大家都熟悉吧，就是用來檢查 JavaScript 代碼問題的工具。

現在它支持 Model Context Protocol（MCP）了，簡單來說，就是能讓 AI 模型跟它配合起來。

這樣 AI 就能在咱們常用的開發工具，比如 IDE 里直接用 ESLint，幫咱們更智能地檢查代碼、分析問題。

特別是用 GitHub Copilot 這類 AI 編程助手的小伙伴，這功能太實用了！

以后寫代碼的時候，AI 就能在旁邊幫著盯著代碼規范，及時提醒哪兒寫得不對，減少出錯的可能。

二、怎么在 VS Code 和 Cursor 里用上 ESLint 的 AI 功能？

1. 在 VS Code 里設置

先得安裝個 Copilot Chat 擴展。然后跟著這幾步走：

(1) 建個配置文件

在項目根目錄下新建個文件，叫 .vscode/mcp.json，內容寫成這樣：

{
    "servers": {
        "ESLint": {
            "type": "stdio",
            "command": "npx",
            "args": ["eslint", "--mcp"]
        }
    }
}

這配置就是告訴 VS Code 怎么啟動 ESLint 的 AI 功能。

(2) 全局啟用（可選）

如果想在所有項目里都能用這個功能，就選“用戶設置” ，把上面的配置加到 settings.json 里。

這樣不管在哪個項目里，AI 都能幫著管代碼規范。

2. 在 Cursor 里設置

步驟也簡單：

(1) 建配置文件

在項目目錄里建個 .cursor/mcp.json，內容是：

{
    "mcpServers": {
        "eslint": {
            "command": "npx",
            "args": ["eslint", "--mcp"],
            "env": {}
        }
    }
}

(2) 全局配置（可選）

要是想在所有 Cursor 項目里都用上，就在主目錄建個 ~/.cursor/mcp.json 文件，內容跟上面一樣。

(3) 檢查工具是否可用

配置好了以后，去 Cursor 的 MCP 設置頁看看“可用工具”里有沒有 ESLint MCP 服務器。

要是有了，就說明設置成功了，AI 就能幫你檢查代碼規范了。

三、用 AI 管代碼規范有什么好處？

用上 ESLint 的 AI 功能，好處可不少：

• 提高開發效率：AI 能快速發現代碼里的問題，咱們不用花太多時間自己去找，寫代碼速度自然就上去了。
• 提升代碼質量：AI 檢查代碼比人更細致，能確保代碼符合規范，減少潛在問題。
• 團隊協作更順暢：一個團隊里大家代碼風格不一致很讓人頭疼。AI 幫著管代碼規范，大家寫出來的代碼風格更統一，協作起來也更輕松。

ESLint 接入 AI 真的是開發流程里的一大進步。

以后寫代碼，有 AI 幫著管規范，咱們可以更專注于實現功能。

還沒試過的小伙伴趕緊在自己的項目里試試吧！相信用過之后，你會越來越依賴這個強大的功能，讓 AI 成為你開發過程中的得力助手！

ESLint MCP 官方文檔：https://eslint.org/docs/latest/use/mcp