next.jsで"npx shadcn-ui@latest"を叩いた後に”npm run dev”したところ404エラーになりました。
解決法
どうやら上記コマンドを叩くとデフォルトの/src/app/globals.cssと別に、componentsディレクトリに新規のglobals.cssが生成されるようです。
また、components.jsonというshadcn UIの設定ファイルも同じく生成されているはずです。このファイルのtailwind:{"css":""}の箇所を以下のように書き換えることでエラーが解消され、正常にブラウザに表示されるようになりました。ポイントは適用させたいglobals.cssファイルのパスを正しく入力することです。srcディレクトリ、appディレクトリを使用していない場合はご自身の環境に合わせて適宜編集してください。
"tailwind": {
- "css": "app/globals.css",
+ "css": "src/app/globals.css",
}
↓こちらを参考にしました
https://github.com/shadcn-ui/ui/issues/755