源目录
作为在项目根目录中使用特殊 Next.js app
或 pages
目录的替代方案,Next.js 还支持将应用代码放置在 src
目录下的常见模式。
¥As an alternative to having the special Next.js app
or pages
directories in the root of your project, Next.js also supports the common pattern of placing application code under the src
directory.
这将应用代码与项目配置文件分开,项目配置文件主要位于项目的根目录中,这是一些个人和团队更喜欢的。
¥This separates application code from project configuration files which mostly live in the root of a project, which is preferred by some individuals and teams.
要使用 src
目录,请将 app
Router 文件夹或 pages
Router 文件夹分别移动到 src/app
或 src/pages
。
¥To use the src
directory, move the app
Router folder or pages
Router folder to src/app
or src/pages
respectively.
很高兴知道:
¥Good to know:
/public
目录应保留在项目的根目录中。¥The
/public
directory should remain in the root of your project.
package.json
、next.config.js
和tsconfig.json
等配置文件应保留在项目的根目录中。¥Config files like
package.json
,next.config.js
andtsconfig.json
should remain in the root of your project.
.env.*
文件应保留在项目的根目录中。¥
.env.*
files should remain in the root of your project.如果根目录中存在
app
或pages
,则src/app
或src/pages
将被忽略。¥
src/app
orsrc/pages
will be ignored ifapp
orpages
are present in the root directory.如果你使用的是
src
,你可能还会移动其他应用文件夹,例如/components
或/lib
。¥If you're using
src
, you'll probably also move other application folders such as/components
or/lib
.如果你使用中间件,请确保将其放置在
src
目录中。¥If you're using Middleware, ensure it is placed inside the
src
directory.如果你使用的是 Tailwind CSS,则需要将
/src
前缀添加到 内容部分 中的tailwind.config.js
文件中。¥If you're using Tailwind CSS, you'll need to add the
/src
prefix to thetailwind.config.js
file in the content section.如果你使用 TypeScript 路径进行导入(例如
@/*
),则应更新tsconfig.json
中的paths
对象以包含src/
。¥If you are using TypeScript paths for imports such as
@/*
, you should update thepaths
object intsconfig.json
to includesrc/
.