跳至主要內容

本機連結

有時可能會需要在另一個本機(「下游」)儲存庫中測試您本機 typescript-eslint 儲存庫的變更。執行此動作的一般策略如下

  1. 全域連結:使用套件管理員的全球連結指令使 @typescript-eslint/* 套件可用作為全球符號連結。
  2. 儲存庫連結:使用套件管理員的連結指令在下游本機儲存庫中參考那些全球符號連結。
  3. 嘗試規則:透過在下游本機儲存庫中啟用它們來測試您本機的規則和外掛程式。

全球連結

若要讓所有 @typescript-eslint/* 套件都能在全球範圍內使用,請在 typescript-eslint 儲存庫根目錄中執行這個指令

for package in ./packages/*; do
cd $package
# Insert your package manager's global link command here
cd ../..
done

取代那個 # 註解的指令會根據本地下游儲存庫的套件管理員而定

儲存庫連結

現在 @typescript-eslint/* 套件可以在本機使用,可以在本地下游儲存庫中連結至它們。對本地下游儲存庫依賴的任何 @typescript-eslint/* 套件,執行該儲存庫的套件管理員連結指令

  • npm: npm link @typescript-eslint/eslint-plugin @typescript-eslint/parser
  • pnpm: pnpm link @typescript-eslint/eslint-plugin @typescript-eslint/parser --global
  • Yarn v1/classic: yarn link @typescript-eslint/eslint-plugin @typescript-eslint/parser
  • Yarn v2/v3/berry: yarn link /path/to/your/typescript-eslint/packages/eslint-plugin /path/to/your/typescript-eslint/packages/parser
    • 這會在本地下游儲存庫的 package.json 檔案中為每個套件新增 resolutions 項目

現在您應該可以在本地下游儲存庫中執行 ESLint,就像您平時會執行的步驟一樣,並讓它參考本地的 typescript-eslint 套件。

提示

若要確認本地套件已使用,請考慮在檔案中新增 console.log("Hello, world!");,例如在 ./packages/eslint-plugin/dist/index.js,然後在對本地下游儲存庫進行 linting 檢查時,請確定日誌已顯示。

嘗試規則

現在您已將 @typescript-eslint/* 套件連結至本地下游儲存庫,下一步就是將規則包含在本地儲存庫 ESLint 設定檔中,例如

.eslintrc.json
{
"rules": {
"@typescript-eslint/your-awesome-rule": "error"
}
// ...
}

之後,您需要執行儲存庫的 lint 腳本,變更應該會反映於專案。

注意

變更後 @typescript-eslint/ 套件不會反映在您的連結儲存庫中,直到在本地建置為止。若要重新建置所有套件,請從根目錄執行 yarn build。若要只對 ESLint 外掛程式啟動監控模式建置器,請從 ./packages/eslint-plugin 執行 yarn build --watch

疑難排解

找不到套件 (無法找到模組)

如果本地 @typescript-eslint/* 套件有發佈的 npm 版本中不存在的依賴項,下游的本地儲存庫中進行 linting 時可能會看到不同的錯誤

Error: Failed to load parser '@typescript-eslint/parser' declared in '.eslintrc.js': Cannot find module 'ts-api-utils'
Require stack:
- /repos/typescript-eslint/packages/typescript-estree/dist/convert-comments.js

這種情況下,您可以在下游的本地儲存庫中手動安裝任何遺失的套件作為開發依賴項 (--save-dev)。

yarn add ts-api-utils -D

Yarn v2 / v3 / berry 對衝突的依賴項非常嚴謹。使用 Yarn 在下游的本地儲存庫中安裝時,可能會看到有關衝突版本錯誤

$ yarn
➤ YN0000: ┌ Resolution step
➤ YN0000: └ Completed
➤ YN0000: ┌ Fetch step
➤ YN0000: └ Completed
➤ YN0000: ┌ Link step
➤ YN0071: │ Cannot link @typescript-eslint/parser into eslint-plugin-import@npm:2.27.5 [6d590] dependency debug@npm:4.3.4 [531b6] conflicts with parent dependency debug@npm:3.2.7 [65bed]
➤ YN0071: │ Cannot link @typescript-eslint/parser into eslint-module-utils@npm:2.8.0 [0b7fa] dependency debug@npm:4.3.4 [531b6] conflicts with parent dependency debug@npm:3.2.7 [65bed]
➤ YN0000: └ Completed in 0s 370ms
➤ YN0000: Failed with errors in 0s 643ms

要解決這個問題,您可以在下游的本地儲存庫的 package.json 中加入手動輸入至 resolutions 欄位中,給每個失敗的套件用。在 Yarn 錯誤中使用參考到的最大主版本

{
"resolutions": {
"@typescript-eslint/eslint-plugin": "portal:/path/to/your/typescript-eslint/packages/eslint-plugin",
"@typescript-eslint/parser": "portal:/path/to/your/typescript-eslint/packages/parser",
"debug": "4"
}
}

重新執行 yarn 應該會成功。