徹底改變你的代碼：JavaScript linter—Oxlint

作為開發人員，總是在尋找能夠簡化工作流程并提高工作效率的工具。Oxlint 是一個用 Rust 編寫的 JavaScript linter，現在提供了可以替代ESLint的新方案，其性能比ESLint提升了 50-100 倍。

在本文中，將學習如何將 Oxlint 集成到開發流程中，充分利用其速度和效率。

了解 Oxlint

Oxc (The Oxidation Compiler) 是一個用Rust 編寫的JavaScript 和 TypeScript高性能工具集合。Oxc 正在構建一個解析器、linter、格式化程序、轉譯器、壓縮器、解析器。

Oxlint 是一種靜態代碼分析工具，旨在通過檢測錯誤和執行代碼樣式規則來提高代碼質量。與用 JavaScript 編寫的 ESLint 不同，Oxlint 是用 Rust 開發的，Rust 是一種以其性能和安全性而聞名的語言。這種核心技術的差異賦予了 Oxlint 顯著的速度優勢。

Oxlint 的主要特點

性能

處理代碼的速度比 ESLint 快 50-100 倍，并且隨著 CPU 核心的數量而擴展。

安全性

Rust 的內存安全保證消除了某些類別的錯誤。

兼容性

支持 .eslintignore 和 ESLint comment disabling。

適用于大多數為 ESLint 設計的配置和插件。

檢查正確性的 Lint

Oxlint 默認識別錯誤、冗余或令人困惑的代碼——優先考慮正確性而不是不必要的挑剔規則（分類為perf、suspicious、pedantic或style），默認情況下禁用這些規則。

使用方便

oxlint 設計為開箱即用的零配置；甚至 Node.js 也不是必需的。大多數調整可以通過命令行進行，并且從 ESLint 配置文件讀取當前正在進行中。

增強診斷?

理解 linter 消息可能具有挑戰性。Oxlint 旨在通過查明根本原因并提供有用的消息來簡化這一過程，從而無需閱讀冗長的規則文檔，從而節省寶貴的時間。

oxlint -D perf在vscode 存儲庫中運行

綜合規則

Oxlint 尚未提供插件系統，但正在積極整合 TypeScript、React、Jest、Unicorn、JSX-a11y 和 Import 等流行插件的規則。并且也在研究基于 DSL 的插件系統。

Oxlint的安裝與使用

在JavaScript / TypeScript代碼庫中測試 Oxlint，只需在存儲庫的根目錄中執行以下命令：

npx oxlint@latest
# or
pnpm dlx oxlint@latest
# or
yarn dlx oxlint@latest
# or
bunx oxlint@latest
# or
deno run npm:oxlint@latest

或者將其保存到 package.json 中：

npm add -D oxlint
# or
pnpm add -D oxlint
# or
yarn add -D oxlint
# or
bun add -D oxlint

VSCode 擴展?

Oxc 提供了 VCode 插件供開發者使用：下載官方VSCode 擴展。

實際效果

在現實場景中，Shopify 報告稱，他們的 75分鐘 ESLint 運行現在只需 10 秒。

來自 Shopify DX 和 Preact 的創建者 Jason Miller 的：

oxlint 對我們 Shopify 來說是一個巨大的勝利。我們之前的 linting 設置需要 75 分鐘才能運行，因此我們將其分散到 CI 中的 40 多名工作人員中。 相比之下，oxlint 在單個工作程序上檢查相同代碼庫大約需要 10 秒，并且輸出更容易解釋。我們甚至發現了一些在遷移時被舊設置隱藏或跳過的錯誤！

來自Vue和vite創建者Evan You尤雨溪的使用體驗:

在 Vue 3 代碼庫上運行 oxlint，約 200 條規則 + 約 590 個文件在 50 ms內完成，而再次運行更是只需30ms。

來自Moonrepo創建者Miles Johnson的使用體驗：

實際思考

Oxlint是否會取代Eslint?

Oxlint官方負責人表明：

現階段，oxlint 并不打算完全取代 ESLint；當 ESLint 的緩慢成為工作流程中的瓶頸時，它可以作為增強功能。

官方建議開發者在lint-staged或CI設置中先運行 Oxlint 再運行 ESLint。這樣，大部分常見問題還沒走到 Eslint 這一步就被 Oxlint 擋住了。

Oxlint 剛剛發布面市，其生態支持和功能的完備肯定不及市面上已經成熟的工具。必然需要一段時間才能達到插件/規則的同等水平。但是，Oxlint 的出現無疑給 JavaScript 和 TypeScript 的開發者們提供了一個新的選擇。它的高效性和易用性對于一些特定場景下的需求來說，可能是一個不錯的解決方案。

參考資料

https://oxc-project.github.io/

https://github.com/oxc-project/oxc

作者：京東保險 張潔

來源：京東云開發者社區 轉載請注明來源