src 目录

除了在项目根目录下使用 Next.js 特有的 apppages 目录外,Next.js 也支持将应用代码放在 src 文件夹下的常见模式。

这种方案将应用代码与主要位于项目根目录的配置文件分离,受到部分开发者和团队的青睐。

要使用 src 文件夹,请将应用路由文件夹 app 或页面路由文件夹 pages 分别移动到 src/appsrc/pages 目录下。

包含 `src` 文件夹的示例目录结构

须知:

  • /public 目录应保留在项目根目录
  • 配置文件如 package.jsonnext.config.jstsconfig.json 应保留在项目根目录
  • .env.* 文件应保留在项目根目录
  • 如果根目录存在 apppages 文件夹,src/appsrc/pages 将被忽略
  • 若使用 src 文件夹,建议同时移动其他应用目录如 /components/lib
  • 若使用中间件 (Middleware),请确保其位于 src 文件夹内
  • 若使用 Tailwind CSS,需在 tailwind.config.js 文件的 content 配置项 中添加 /src 前缀
  • 若使用 TypeScript 路径别名(如 @/*),需更新 tsconfig.json 中的 paths 对象以包含 src/ 路径