[@types/eslint] Property 'scopes' in type 'ScopeManager' is not assignable をなんとかする

@types/eslint を入れると @types/eslint-scope の型定義とぶつかって tsc が通らなくなるということがあった。

$ npm run typecheck

> ui@1.0.0 typecheck
> tsc --noEmit

node_modules/@types/eslint-scope/index.d.ts:12:5 - error TS2416: Property 'scopes' in type 'ScopeManager' is not assignable to the same property in base type 'ScopeManager'.

これは npm パッケージは以下のバージョンで発生した。@types/eslint-scope は webpack が使っているもので依存の依存である。

$ npm ls @types/eslint
├── @types/eslint@8.56.7

$ npm ls @types/eslint-scope
└─┬ webpack@5.89.0
  └── @types/eslint-scope@3.7.3

なんとかする

たかが設定ファイルの型定義なので、これのために webpack を入れ直すのはちょっと億劫だった。依存モジュールを無理やりアップグレードする方法として package.json#overrides がある。

• package.json | npm Docs

型定義なので依存関係の動作には影響がないものとして、これを最新にアップグレードしてしまう。

  "overrides": {
    "webpack": {
      "@types/eslint-scope": "^3.7.7"
    }
  }

この指定をして npm install を叩くと @types/eslint-scope@3.7.7 が入ってくれる。

$ npm ls @types/eslint-scope
...
└─┬ webpack@5.89.0 overridden
  └── @types/eslint-scope@3.7.7 overridden

このバージョンでは型定義が整合しているようで、tsc は通ってくれた。

$ npm run typecheck

> ui@1.0.0 typecheck
> tsc --noEmit

$