我記得10年前，我用Javascript只是爲了補充一下Asp.net上AjaxControl的動態數據加載，而現在Javascript幾乎成爲了前端開發的主流語言。
如果仍然用10年前那種把Javascript當成小腳本的方式來完成現在的前端項目，那麼任何一個項目都可能變成一個噩夢。
爲什麼是ESlint
衆所周知，Javascript是一種動態語言，其優勢很明顯，缺點也衆所周知（參考知乎上那些大神對Javascript的吐槽），用Javascript寫出來的代碼，通常靠代碼走查或者運行的方式來發現其中的錯誤。ESLint的出現，則扭轉了這種被動局面。
ESLint的配置和使用方式網上有很多，建議大家選擇Airbnb的規則對代碼進行檢查（文章的最後給出了Airbnb規則的安裝配置參考）。
基於Airbnb配置的ESLint
基於Airbnb配置的ESLint，給我們帶來了如下好處：
- 檢查import 的正確性（規則名稱：import/named）
- 在模塊內，對沒有聲明而使用的變量報錯（規則名稱：no-undef）
- 提出代碼編寫風格的建議
第1，2 兩點對優化/重構代碼尤其重要，第3點則能幫助我們很快了解並掌握了es6的規範，讓我們看上去像一個使用es6的“老手”。（實際上，任何一門語言，都可以通過它的lint工具讓你快速掌握這門語言的特性）
參考
掘金的eslint的使用指南（非常全面的配置和使用細則，偶爾我也會去參考）
如何充分利用Airbnb的配置
import的正確性檢查
Airbnb中有一個規則import/named，可以檢查從其它模塊中引入的變量名稱是否正確。如果你是一個持續重構/改善代碼的“狂熱分子”，我想你已經懂了這其中的巨大價值。
libs.js
export const UpdateMemeberInfomation = (info)=>{ /* 業務代碼 */ };
export const GetMemberInforamtion = (id)=>{ /* 業務代碼 */ };
index.js
import { UpatMemberInforamtion } from './libs';
....
針對上面的代碼，ESLint會報如下錯誤
1:10 error UpatMemberInforamtion not found in './libs' import/named
但是，如果在libs.js中，以對象的方式導出，那麼Airebnb的import/named規則就無能爲力了。
const UpdateMemeberInfomation = (info) => { /* 業務代碼 */ };
module.exports = {
UpdateMemeberInfomation,
};
讀到這裏，我想你已經知道了該如何調整代碼以利用Airbnb的配置檢查帶來的好處。
是的，在模塊中直接導出你要導出的對象。
export const UpdateMemeberInfomation = (info)=>{ /* 業務代碼 */ };
export const GetMemberInforamtion = (id)=>{ /* 業務代碼 */ };
對沒有定義而使用的變量報錯
大家都知道，在Javascript的嚴格模式下，使用沒有定義的變量或對象是要報錯的，沒有人會故意這麼做。
這種錯誤的發生通常在重構代碼或者鍵盤敲擊上。
const UpdateMemberInfo = ()=>{ /* 業務代碼 */};
const clickHandler = () =>{
updateMemberInfo();
/* 其它業務代碼 */
};
對於上面的代碼，ESLint會報錯告訴我們哪一行代碼中使用了沒有被定義的變量，從而讓我們在運行代碼之前就發現問題。
（對於全局變量，可以將其添加到.eslintrc文件中）
小結
只有持續重構和優化代碼才能將代碼逐漸變得強壯，而“重構”和“優化”中卻包含着打破原有代碼完整性的風險，上面的兩條Airbnb規則在很大程度上幫我們規避了這個風險，從而保證了模塊間名稱引用的完整性和模塊內部名稱使用的完整性。
有了ESLint的Airbnb配置規則的保駕護航，我們就可以將代碼的持續重構和優化變成常態。從而讓我們編寫的Javascript變得更加強壯。
Airebnb規則安裝配置及使用
1. 安裝ESLint
ESLint我個人推薦安裝在本地，然後從本地進行配置，這樣不會造成後面的庫可能不匹配問題
npm install --save-dev eslint
2. 通過ESLint進行配置。
node_modules/.bin/eslint --init
3. 在shell的交互模式下，我的選擇如下。
> To check syntax, find problems, and enforce code style
> Javascript modules (import/export)
> React
> N
> Browser
> Use a popular style guide
> Airbnb: https://github.com/airbnb/javascript
> JavaScript
之後，ESLint會完成相關庫的下載。
最後，打開項目的package.json文件，在scripts節點下添加命令。
"lint": "./node_modules/.bin/eslint --fix --fix-type suggestion,layout,problem ."
然後運行命令進行代碼檢查，代碼格式問題ESLint會幫你修復。
npm run lint
後面在使用過程中你可能會想跳過某些文件的檢查，或者調整某些規則的報警級別，這些需求可以通過修改.eslintignore, .eslintrc.js完成。