javascriptにcssを埋め込めず、style-loaderのバージョンを落としたら成功した話

今まで正常に動いていたプロジェクトで、style-loaderをアップデートしたらSwiperのcssファイルが読み込まれなくなりました。

詳細な原因は不明ですが解決方法はわかったので備忘録として残します。

エラー内容

webpack + babelによるコンパイルは問題ないのですが、ブラウザで表示すると下記のようなエラーが表示されます。

Uncaught TypeError: Cannot read properties of undefined (reading 'locals')
    at Object../node_modules/swiper/css/swiper.min.css (swiper.min.css?2abe:7)
    at __webpack_require__ (bootstrap:19)
    〜略〜

エラーになる環境

• node v16.13.1
• style-loader v3.3.1
• css-loader v6.5.1

成功した環境

• node v16.13.1
• style-loader v2.0.0 ← ダウングレードした
• css-loader v6.5.1

おわり

なぜstyle-loader v3系にするとエラーになるのかは不明です。