建站
咨詢
售后
建站咨詢
新聞中心
網(wǎng)站的建設(shè)創(chuàng)新互聯(lián)公司專注網(wǎng)站定制,經(jīng)驗(yàn)豐富,不做模板,主營網(wǎng)站定制開發(fā).小程序定制開發(fā),H5頁面制作!給你煥然一新的設(shè)計(jì)體驗(yàn)!已為LED顯示屏等企業(yè)提供專業(yè)服務(wù)。
當(dāng)寫js代碼的時(shí)候，一個(gè)校驗(yàn)工具可以幫助我避免愚蠢的錯(cuò)誤。盡管我有許多年的經(jīng)驗(yàn)，但是我仍然有變量命名不正確、產(chǎn)生語法錯(cuò)誤以及忘記正確處理錯(cuò) 誤。在我浪費(fèi)時(shí)間，尤其是客戶時(shí)間之前，一個(gè)好的校驗(yàn)工具或校驗(yàn)器可以告訴我這些問題。好的校驗(yàn)工具可以確保一個(gè)項(xiàng)目遵循代碼規(guī)范。
存在四個(gè)可以使用的js校驗(yàn)器，但是怎么選擇使用哪一個(gè)呢？接下來讓我們看看這四種流行方案的特點(diǎn)、優(yōu)點(diǎn)和不足：JSLint、JSHint、JSCS、ESLint。
Overview
四種工具用相同的基本方式工作。他們都有一套用戶分析、報(bào)告js文件錯(cuò)誤的規(guī)則。他們都可以通過npm安裝。他們都可以通過命令行使用、作為Grunt插件使用、也可以集成到編輯器中。他們四種均支持使用注釋進(jìn)行配置。
但是相似點(diǎn)結(jié)束了。每個(gè)工具都有各自的優(yōu)點(diǎn)和缺點(diǎn)–優(yōu)點(diǎn)是通過比較得到的。
JSLint
JSLint是其中最老的工具。在2002年 Douglas Crockford開發(fā)了該工具，根據(jù)其經(jīng)驗(yàn)，強(qiáng)制使用js語言中精粹的部分。如果你同意這些精粹，JSLint能成為一個(gè)好的工具。
JSLint的缺點(diǎn)是不能配置和拓展。你根本不能禁掉需要特性，并且很多缺少文檔。官方文檔非常不友好，例如缺少如何將其集成到編輯的信息。
優(yōu)點(diǎn)
- 參數(shù)配置完成，可以直接使用
缺點(diǎn)
- JSLint不存在配置文件，如果想改變參數(shù)設(shè)置，那就存在問題
- 有限的配置選項(xiàng)，許多規(guī)則不能禁掉
- 不能增加個(gè)性化規(guī)則
- 沒有文檔記錄規(guī)則
- 很難弄清楚哪個(gè)規(guī)則引起的錯(cuò)誤
JSHint
作為一個(gè)可配置的JSLint版本，JSHint被開發(fā)出來。你可以配置每個(gè)規(guī)則，將其放到一個(gè)配置文件中，這樣在大項(xiàng)目中可以容易使用。JSHint對(duì)每個(gè)規(guī)則有好的文檔，所以可以準(zhǔn)確知道每個(gè)規(guī)則的作用。將其集成到編輯器也是簡單的。
JSHint的一個(gè)小缺點(diǎn)是里面的松散默認(rèn)配置。也即是你在使其可用之前必須將其啟動(dòng)。和ESLint相比，確定哪個(gè)規(guī)則用戶開啟或關(guān)閉錯(cuò)誤信息，JSHint是更加困難。
優(yōu)點(diǎn)
- 大多是參數(shù)可以配置
- 支持配置文件，在大項(xiàng)目中容易使用
- 已經(jīng)支持需要類庫，像jQuery、QUnit、NodeJS、Mocha等
- 支持基本的ES6
缺點(diǎn)
- 難于知道哪個(gè)規(guī)則產(chǎn)生錯(cuò)誤
- 存在兩類選項(xiàng)：強(qiáng)制選項(xiàng)和松散選項(xiàng)。使得配置有些混亂
- 不支持自定義規(guī)則
JSCS
JSCS不同于其他，因?yàn)槿绻唤o它一個(gè)配置文件或告訴它一個(gè)配置項(xiàng)，JSCS
不會(huì)做任何事情。可以存他們的網(wǎng)站現(xiàn)在配置項(xiàng)，所以這不是個(gè)大問題，并且有許多配置項(xiàng)，例如jQuery代碼風(fēng)格配置項(xiàng)、Google配置項(xiàng)。
它有超過90個(gè)不同的規(guī)則，通過插件可以創(chuàng)建自定義規(guī)則。當(dāng)和其他工具集成需要特定格式時(shí)，JSCS也支持自定義報(bào)告使得變得非常容易。
JSCS是一個(gè)代碼風(fēng)格檢查器。這意味著它僅僅匹配代碼格式的問題，不匹配潛在的bugs、errors。因此，跟其他工具相比缺少靈活性，但是如果你僅僅強(qiáng)制檢查代碼風(fēng)格，JSCS也是一個(gè)好的工具。
優(yōu)點(diǎn)
- 支持自定義報(bào)告，更容易與其他工具集成
- 如果你遵循一種可用的代碼風(fēng)格，配置項(xiàng)和準(zhǔn)備好的配置文件使其容易啟動(dòng)
- 在報(bào)告中存在標(biāo)記包含規(guī)則名字，所以很容易指出哪個(gè)規(guī)則造成了錯(cuò)誤
- 通過自定義插件進(jìn)行拓展
缺點(diǎn)
- 僅僅檢查代碼風(fēng)格的問題。JSCS不檢查潛在存在的bugs，例如不適用的變量、偶然的全局變量等等
- 四個(gè)工具中最慢，但是在使用中不是一個(gè)問題
ESLint
ESLint是***出來的工具。它被設(shè)計(jì)的容易拓展、擁有大量的自定義規(guī)則、容易的通過插件來安裝。它給出準(zhǔn)確的輸出，而且包括規(guī)則名，這樣可以知道哪個(gè)規(guī)則造成了錯(cuò)誤。
ESLint文檔多少有些混亂。規(guī)則容易查找，以及被分為邏輯組，但是配置指南在有些地方容易弄混。然而它可以在一個(gè)地方提供鏈接去編輯集成、插件和樣例。
優(yōu)點(diǎn)
- 靈活：任何規(guī)則都可以開啟閉合，以及有些規(guī)則有些額外配置
- 很容易拓展和有需要可用插件
- 容易理解產(chǎn)出
-
包含了在其他檢查器中不可用的規(guī)則，使得ESLint在錯(cuò)誤檢查上更有用
- 支持ES6，唯一支持JSX的工具
- 支持自定義報(bào)告
缺點(diǎn)
- 需要一些配置
- 速度慢，但不是主要問題
我的推薦
我的選擇是ESLint。JSHint是嚴(yán)格和不可配置的，而JSHint缺少拓展機(jī)制。JSCS如果僅僅用于代碼風(fēng)格檢驗(yàn)是一個(gè)好的選擇，但是ESLint不僅可以進(jìn)行代碼風(fēng)格的檢驗(yàn)，而且可以檢查代碼中的bug和其他問題。
如果使用ES6，ESLint也是明顯的選擇。在上面提到的工具中，ESLint對(duì)ES6支持的最廣泛。
如果你像嘗試ESLint，我已經(jīng)創(chuàng)造了5步快速開始指南。你可以 download the ESLint 5-step quickstart guide form my website
JSHint是第二選擇。如果不需要ESLint先進(jìn)的特點(diǎn)，JSHint一旦配置就可以捕獲需要好的問題。帶有許多規(guī)則的JSCS，如果出了代碼風(fēng)格外不進(jìn)行其他檢查，將是一個(gè)好的選擇。
我非常猶豫去推薦JSLint。其他工具做同樣地事情，但是不強(qiáng)制用戶遵守這些規(guī)則。唯一的例外是你碰巧統(tǒng)一那些強(qiáng)制規(guī)則，那是值得深入研究的情況。
一個(gè)檢驗(yàn)工具是捕獲問題的很好一步，但是僅僅能看到它規(guī)則的錯(cuò)誤。為了更進(jìn)一步的bug自動(dòng)捕獲，我推薦使用單元測(cè)試。code view也有助于達(dá)到該目的。
你和你的團(tuán)隊(duì)是如何保障代碼質(zhì)量的呢？
英文原文：http://www.sitepoint.com/comparison-javascript-linting-tools/
當(dāng)前名稱：javascript檢驗(yàn)工具的比較
網(wǎng)頁地址：http://m.5511xx.com/article/cosepcg.html
