tsconfigのpathsを有効にするため tsconfig-paths-webpack-plugin を入れたら型エラーになりました。

症状

webpack.config.ts

import { TsconfigPathsPlugin } from 'tsconfig-paths-webpack-plugin';

...省略

  resolve: {
    plugins: [
      new TsconfigPathsPlugin({
        configFile: "./tsconfig.json",
      }),
    ],
  },

とリポジトリ記載にしたがってやっても、

Type 'TsconfigPathsPlugin' is not assignable to type '"..." | ResolvePluginInstance'.

というエラーが出てしまいます。

"webpack": "^5.74.0",
"tsconfig-paths": "^4.1.0",
"tsconfig-paths-webpack-plugin": "^3.5.1",

を使用。

gitissueやstackoverflowなどでも同様のエラーが出たという質問などがあり、人によってはtsconfig-paths-webpack-pluginのバージョンを変えたら上手くいったという人もいますが自分の場合は変えても上手くいかず。

webpack4に変えればいけたという人もいますがそこまではしたくなく。

解決

ということで

webpack.config.ts

  resolve: {
    plugins: [
      new TsconfigPathsPlugin({
        configFile: "./tsconfig.json",
      }) as any,
    ],
  },

みんなの~~大嫌いな~~anyを使用して~~逃げの~~解決しました。もっと良い解決法があったらコメ欄で教えてもらえると嬉しいです。