讓人又愛又恨的ESLint

time911發表於2018-12-10
EsLint

讓人又愛又恨的ESLint

引言

ESLint 是用來檢查我們寫的 JavaScript 程式碼是否滿足指定規則的靜態程式碼檢查工具。

ESLint可以給我們帶來什麼：

非常舒服的程式碼書寫風格，強迫你去掉所有的分號。

eslint
  • 統一的程式碼編寫格式，使得程式碼書寫風格統一。
  • 更加嚴格的書寫要求，減少了程式碼出錯的概率。

在webpack構建的專案中使用ESLint

  1. 首先全域性安裝ESLint
npm install  --save-dev eslint eslint-loader複製程式碼
  1. 在webpack中新增配置
module: { 
 preLoaders: [    {test: /\.js$/, loader: "eslint-loader", exclude: /node_modules/
  }  ]
  }複製程式碼
  1. 新建名為 .eslintrc 的檔案。該檔案的內容為對 ESLint 的配置。（一般vue-cli構建的專案會自帶這個檔案）
{ 
 "env": { 
   "browser": true,    "commonjs": true,    "es6": true  
  },  "parserOptions": { 
   "ecmaVersion": 6  
  },  "rules": { 
   "no-eq-null": 2 //禁止對null使用==或!=運算子  
  }
  }複製程式碼
  1. env：你的指令碼將要執行在什麼環境中
Environment可以預設好的其他環境的全域性變數，如brower、node環境變數、es6環境變數、mocha環境變數等複製程式碼
  1. 開啟規則和發生錯誤時報告的等級規則的錯誤等級有三種：
0或'off'：關閉規則。 1或'warn'：開啟規則，並且作為一個警告（並不會導致檢查不通過）。 2或'error'：開啟規則，並且作為一個錯誤 (退出碼為1，檢查不通過)。引數說明： 引數1 ： 錯誤等級 引數2 ： 處理方式複製程式碼
  1. 我只寫了最簡單的一個檢測，檢視更多規則請參看官方規則
  2. 就我個人來說喜歡逛gayhub,看看別人怎麼寫規則，如果還不錯就佔為己有了。嘻嘻嘻…

前方高等，拿走不謝：

來源：https://juejin.im/post/5c0e609af265da616c657136

相關文章