從 TSLint 遷移到 ESLint

TSLint 過去曾是推薦的代碼檢查工具（Linter），但目前 TSLint 已被棄用，改由 ESLint 取代其職責。本文將協助您從 TSLint 遷移至 ESLint。

ESLint：安裝

您需要安裝 ESLint。由於 ESLint 原生並不支援 TypeScript，因此您還需要安裝 eslint-typescript-support。

npm install --save-dev eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin

或者，如果您使用 yarn 作為套件管理工具：

yarn add eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin --dev

上述指令會安裝 ESLint、新增讓 ESLint 理解 TypeScript 的剖析器（parser），以及一些 TypeScript 專屬的規則。

現在，為了簡化實際的遷移過程，請執行 tslint-to-eslint-config 工具。此工具會讀取您原本的 TSLint 設定，並據此建立「最接近」的 ESLint 設定檔。

npx tslint-to-eslint-config

此指令會下載並執行該工具以進行遷移。如需更多選項，請查閱該工具的使用指南。

現在應該會出現一個新的 .eslintrc.js 檔案、一個日誌檔案（tslint-to-eslint-config.log），以及可能變更的其他檔案（例如 .vscode/settings.json）。請仔細檢閱這些變更（特別是對現有檔案所做的修改），並檢查日誌檔案。

ESLint：設定

.eslintrc.js 檔案通常足以讓您開始使用，但 parserOptions.project 屬性很可能仍指向您的 tsconfig.json 檔案。這意味著 ESLint 規則可以使用語意資訊（例如：這個變數是字串還是數字陣列？）。此設定能啟用一些強大的規則，但會導致 ESLint 的運算時間大幅增加。擴充功能的預設規則不需要語意資訊，除非您自行新增了需要此功能的規則，否則我們建議您移除 parserOptions.project 屬性。

ESLint：執行

現在您可以開始執行 ESLint，但在執行之前，我們建議您停用 TSLint。請開啟「擴充功能」（Extensions）檢視，並在 TSLint 擴充功能的快顯功能表中選擇「停用」（Disable）。

是時候開始檢查代碼了！請使用此指令：eslint -c .eslintrc.js --ext .ts <mySrcFolder>（請注意 --ext .ts 選項，它會告訴 ESLint 檢查 TypeScript 檔案）。我們建議將此指令加入 package.json 檔案的 scripts 區段中，如下所示：

"lint": "eslint -c .eslintrc.js --ext .ts <mySrcFolder>"

若要將 ESLint 整合至 Visual Studio Code，請執行下列操作：

安裝 ESLint 擴充功能。
透過 Tasks: Configure Task 指令建立一個工作，並選擇 npm: lint。
在產生的 tasks.json 檔案中，將問題比對器（problem matcher）設定為 $eslint-stylish。

提示：ESLint 在處理方式上通常「更嚴謹」，您可能會看到以前沒有出現過的警告，例如提示缺少分號。請嘗試使用 --fix 選項，讓 ESLint 自動為您清理這些問題。

TSLint：移除

恭喜您。您現在應該已經完成 ESLint 的設定，是時候進行清理工作了。

移除 TSLint 的方式取決於您的專案，但通常包括以下步驟：

更新 .vscode/extensions.json，將 ESLint 設為推薦擴充功能，並移除 TSLint。
```
"recommendations": [
  "dbaeumer.vscode-eslint"
]
```
移除 tslint.json 檔案。
在 package.json 檔案中移除 tslint 相依性。
使用 npm uninstall tslint 解除安裝 TSLint。

5/28/2026