src ディレクトリ
プロジェクトのルートに特別な Next.js の app または pages ディレクトリを配置する代わりに、Next.js は src フォルダ内にアプリケーションコードを配置するという一般的なパターンもサポートしています。
これにより、アプリケーションコードとプロジェクトの設定ファイル(主にプロジェクトのルートに配置される)が分離され、一部の個人やチームには好まれる方法です。
src フォルダを使用するには、app Router フォルダまたは pages Router フォルダを、それぞれ src/app または src/pages に移動します。
補足:
/publicディレクトリはプロジェクトのルートに残しておく必要があります。
package.json、next.config.js、tsconfig.jsonなどの設定ファイルはプロジェクトのルートに残しておく必要があります。
.env.*ファイルはプロジェクトのルートに残しておく必要があります。- ルートディレクトリに
appまたはpagesが存在する場合、src/appまたはsrc/pagesは無視されます。
srcを使用する場合、通常は/componentsや/libなどの他のアプリケーションフォルダも移動することになります。- Proxy を使用している場合は、
srcフォルダ内に配置してください。- Tailwind CSS を使用している場合は、
tailwind.config.jsファイルの content セクション に/srcプレフィックスを追加する必要があります。- インポート時に
@/*などの TypeScript パスを使用している場合は、tsconfig.jsonのpathsオブジェクトにsrc/を含めるように更新する必要があります。