問題

tailwind v4 に移行する際、公式ドキュメントに従って以下のコマンドを実行すると、プロジェクト内のファイルが v4 に対応するよう自動的に修正されます。

npx @tailwindcss/upgrade@next

しかし、2025/1/25時点では、Next.jsなどで利用するCSS Module ファイル（hoge.module.css）等は修正してくれません。その結果、以下のようなエラーが発生することがあります。

Error: Cannot apply unknown utility class: text-lg

解決法

CSS Module ファイルの先頭に、以下のようにグローバル CSS ファイルを @reference で参照する設定を追加します。

@reference "./global.css";

ファイルパス、ファイル名は適宜修正してください

なお、この問題は以下の Github issue や discussion で議論中です。

公式の解決策が発表された場合、本記事に追記します。