如何使用ESLint自動修復(fù)和格式化的JavaScript

這篇文章主要介紹“如何使用ESLint自動修復(fù)和格式化的JavaScript”，在日常操作中，相信很多人在如何使用ESLint自動修復(fù)和格式化的JavaScript問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”如何使用ESLint自動修復(fù)和格式化的JavaScript”的疑惑有所幫助！接下來，請跟著小編一起來學(xué)習(xí)吧！

在分析 JavaScript 程序錯(cuò)誤時(shí)，ESLint是可用的最佳 linting 工具之一。ESLint 提供對大量潛在錯(cuò)誤和樣式違規(guī)的檢查。其可插拔架構(gòu)還使任何人都可以編寫自己的規(guī)則和自定義配置。

我最喜歡的功能之一是能夠使用--fix標(biāo)志自動修復(fù)。集成自動修復(fù)通過在將代碼簽入存儲庫之前清除錯(cuò)誤并保持代碼清潔來提供持續(xù)反饋。通過確保貢獻(xiàn)的代碼不需要很少的清理，這可以為你和你的團(tuán)隊(duì)節(jié)省審查代碼的時(shí)間。每當(dāng)我在編輯器中保存文件時(shí)，我都喜歡立即進(jìn)行清理。它提供了一個(gè)快速的反饋循環(huán)并將固定的更改保留到磁盤。

安裝 ESLint

你可以為給定項(xiàng)目（內(nèi)部node_modules）在本地安裝 ESLint，也可以為所有項(xiàng)目全局安裝 ESLint 。我們將在本教程中使用本地 ESLint 安裝，但其中大部分也適用于全局安裝。

npm install eslint --dev

VS代碼

對于 VS Code，安裝ESLint包。然后，要在保存時(shí)格式化，請轉(zhuǎn)到全局設(shè)置并搜索ESLint并打開ESLint: Auto Fix On Save選項(xiàng)。

Atom

對于 Atom，安裝linter-eslint包和任何依賴項(xiàng)。然后，轉(zhuǎn)到插件設(shè)置并檢查Fix errors on save。

Sublime Text

對于 Sublime，使用包控制，安裝ESLint-Formatter包。然后，要在保存時(shí)格式化，請將以下內(nèi)容添加到Preferences -> Package Settings -> ESLint-Formatter -> Settings -- User文件中：

{
  "format_on_save": true
}

Vim/NeoVim

對于 Vim 用戶，ale使用您喜歡的打包工具添加包，例如vim-plug或Vundle到你的$MYVIMRC：

" vim-plug
Plug w0rp/ale
" Vundle
Plugin w0rp/ale

然后，通過設(shè)置以下配置啟用保存時(shí)自動修復(fù)：

let g:ale_fixers = {}
let g:ale_fixers.javascript = ['eslint']
let g:ale_fix_on_save = 1

其他編輯

如果你的編輯器未在上面表示，則可能已經(jīng)存在集成或直接使用eslint命令來實(shí)現(xiàn)類似效果的方法。

例如，Vim 插件將運(yùn)行如下內(nèi)容：

eslint -c <path-to-config> --fix <path-to-current-file>

然后，重新加載緩沖區(qū)中的文件。

到此，關(guān)于“如何使用ESLint自動修復(fù)和格式化的JavaScript”的學(xué)習(xí)就結(jié)束了，希望能夠解決大家的疑惑。理論與實(shí)踐的搭配能更好的幫助大家學(xué)習(xí)，快去試試吧！若想繼續(xù)學(xué)習(xí)更多相關(guān)知識，請繼續(xù)關(guān)注億速云網(wǎng)站，小編會繼續(xù)努力為大家?guī)砀鄬?shí)用的文章！