TypeScript TSLint 與 ESLint

本節將介紹怎樣在一個 TypeScript 項目中使用 ESLint 規范，至于為什么不推薦使用 TSLint，可以看下這篇文章：TypeScript 官方已經決定全面采用 ESLint，ESLint 的 TypeScript 解析器也成為獨立項目，專注解決雙方兼容性問題。

所以，同開發前端項目一樣，熟練掌握 ESLint 規則，也成了 TypeScript 項目開發的必要條件。

1. 慕課解釋

ESLint 是一個插件化并且可配置的 JavaScript 語法規則和代碼風格的檢查工具。

保持代碼風格的一致性能增加可讀性，更便于團隊合作。保持一致就意味著要對我們編寫的代碼增加一定的約束，ESLint 就是這么一個通過各種規則對我們的代碼添加約束的工具。

2. 用 ESLint 規范 Typescript 代碼

安裝 ESLint 規范 Typescript 代碼所需依賴包：

npm install -d eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin

@typescript-eslint/parser 庫是 ESLint 的 TypeScript 解析器，用來檢查和規范 TypeScript 代碼。

在項目根目錄下創建 .eslintrc.js 文件進行配置：

module.exports = {
  root: true,
  env:{                         
    browser: true,
    node: true,
  }  
  parser:  '@typescript-eslint/parser',
  extends: [
    'plugin:@typescript-eslint/recommended'
  ],
  plugins: [
    '@typescript-eslint'
  ],
  rules: {
    
  }                      
}

其中屬性 rules 是對象類型，每個團隊都有自己的一套標準規范，按照要求在此配置對應的 ESLint 檢測規則即可。

3. 小結

在掌握了 ESLint 的配置規則后，還可以搭配 prettier、husky、lint-staged 等這些優秀的庫形成適合自己團隊的代碼風格。