src ディレクトリ

プロジェクトのルートに特別な Next.js の app や pages ディレクトリを持たせる代わりに、Next.js はアプリケーションコードを src ディレクトリの下に配置する一般的なパターンもサポートしています。

これは、主にプロジェクトのルートに存在するプロジェクトの設定ファイルからアプリケーションコードを分離するもので、一部の個人やチームが好みます。

src ディレクトリを使用するには、app Router フォルダまたは pages Router フォルダをそれぞれ src/app または src/pages に移動します。

Good to know:

/public ディレクトリはプロジェクトのルートに残す必要があります

package.json、 next.config.js、tsconfig.json といった設定ファイルはプロジェクトのルートに残す必要があります

.env.* ファイルはプロジェクトのルートに残す必要があります

app または pages がルートディレクトリに存在する場合、src/app または src/pages は無視されます

src を使用している場合、他のアプリケーションフォルダ、たとえば /components や /lib も移動することが多いでしょう

Middleware を使用している場合、src ディレクトリ内に配置してください

Tailwind CSS を使用している場合、tailwind.config.js ファイルの content section に /src プレフィックスを追加する必要があります

@/* のような TypeScript パスによるインポートを使用している場合、paths オブジェクトを tsconfig.json に更新し、src/ を含める必要があります