Nanolier

webpack5で「fs」や「path」を使用した際にビルドできない場合の対処法

2023/01/10

Module not found: Error: Can't resolve 'path' in '***'

下記のエラーメッセージ

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
- add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
- install 'path-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "path": false }

webpack5以前では、nodeのpolyfillが含まれていたが、現在は含まれていないので個別で設定する必要がある。
説明に従って、webpack.config.jsのfallbackに下記のように使用するnode.jsのモジュールを追加すれば良い。
ポリフィルは必要なければfalseにしておく。

resolve: {
  fallback: {
    fs: false,
    path: false,
  }
},

これでビルドできるようになります。
お疲れ様でした。