src ディレクトリ
Next.jsの特別なディレクトリである app
や pages
をプロジェクトのルートに配置する代わりに、アプリケーションコードを 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
などの他のアプリケーションフォルダも移動する可能性が高いです- ミドルウェアを使用している場合は、
src
フォルダ内に配置してください- Tailwind CSSを使用している場合、contentセクションで
tailwind.config.js
ファイルに/src
プレフィックスを追加する必要があります@/*
などのTypeScriptパスを使用してインポートしている場合、tsconfig.json
のpaths
オブジェクトを更新してsrc/
を含める必要があります