顶层 src 目录
编辑页面
了解如何在你的 Expo Router 项目中使用顶层 src 目录。
For the complete documentation index, see llms.txt. Use this Use this file to discover all available pages.
使用 SDK 55 及更高版本的 默认模板 创建的项目已经包含一个顶层的 src 目录,其中包含 app、components、constants 和 hooks 目录,无需额外配置。
如果你使用的是 自定义模板 或一个不包含 src 目录的现有项目,请按照以下步骤进行设置。
使用顶层 src 目录
1
将你的 app 目录移动到 src/app。
srcapp_layout.tsxindex.tsxcomponentsbutton.tsxpackage.json2
更新 tsconfig.json 文件中的 TypeScript 路径别名,使其指向 src 目录而不是根目录。如果你使用默认的 @/* 别名,请将其设置为 ./src/*:
tsconfig.json
{ "compilerOptions": { "paths": { "@/*": ["./src/*"] } } }
这样可以在将你的 app 目录移动到 src 后,继续保持 @/ 导入正常工作。
3
重启你的开发服务器。
Terminal
- npx expo start# 或导出用于生产环境- npx expo export注意
- 配置文件(app.config.ts、app.json、package.json、metro.config.js、tsconfig.json)应保留在根目录中。
- src/app 目录的优先级高于根目录下的 app 目录。如果两者都存在,只会使用 src/app 目录。
- public 目录应保留在根目录中。
- 如果 src/app 目录存在,静态渲染将自动使用它。
- 你可以考虑将任何 类型别名 更新为指向 src 目录,而不是根目录。
自定义目录
警告 强烈不建议更改默认根目录。我们不会接受有关使用自定义根目录的项目的 bug 报告。
你可以使用 Expo Router Config Plugin 危险地自定义根目录。下面的配置会将根目录更改为 src/routes,相对于项目根目录。
app.json
{ "plugins": [ [ "expo-router", { "root": "./src/routes" } ] ] }
这可能会导致意外行为。许多工具都假定根目录应为 app 或 src/app。只有与 Expo CLI 完全相同版本的工具才会遵守该配置插件。