基于文件的路由 API 参考

TanStack Router 的基于文件的路由非常灵活，可以根据您的项目需求进行配置。

以下选项可用于配置基于文件的路由

• routesDirectory (必填)
• generatedRouteTree (必填)
• virtualRouteConfig
• routeFilePrefix
• routeFileIgnorePrefix
• routeFileIgnorePattern
• indexToken
• routeToken
• quoteStyle
• semicolons
• apiBase
• autoCodeSplitting
• disableTypes
• addExtensions
• disableLogging
• routeTreeFileHeader
• routeTreeFileFooter
• enableRouteTreeFormatting
• tmpDir

这是路由文件所在的目录路径，相对于 cwd（当前工作目录）。

默认情况下，该值设置为以下内容，不能设置为空字符串或undefined。

./src/routes

./src/routes

这是生成的路由树将保存到的文件路径，相对于 cwd（当前工作目录）。

默认情况下，该值设置为以下内容，不能设置为空字符串或undefined。

./src/routeTree.gen.ts

./src/routeTree.gen.ts

如果disableTypes设置为true，则生成的路由树将保存为.js扩展名而不是.ts。

此选项用于配置虚拟文件路由功能。有关更多信息，请参阅“虚拟文件路由”指南。

默认情况下，此值设置为undefined。

此选项用于识别路由目录中的路由文件。这意味着只有以此前缀开头的文件才会被考虑用于路由。

默认情况下，此值设置为空字符串，因此路由目录中的所有文件都将被考虑用于路由。

此选项用于忽略路由目录中的特定文件和目录。如果您希望“选择性”地包含某些不希望被视为路由的文件或目录，这会很有用。

默认情况下，此值设置为-。

使用此选项时，您可以拥有这样的结构，它允许您将不是路由文件的相关文件放在一起

src/routes
├── posts
│   ├── -components  // Ignored
│   │   ├── Post.tsx
│   ├── index.tsx
│   ├── route.tsx

src/routes
├── posts
│   ├── -components  // Ignored
│   │   ├── Post.tsx
│   ├── index.tsx
│   ├── route.tsx

此选项用于忽略路由目录中的特定文件和目录。它可以采用正则表达式格式。例如，.((css|const).ts)|test-page 将忽略名称中包含 .css.ts、.const.ts 或 test-page 的文件/目录。

默认情况下，此值设置为undefined。

正如路由概念指南中所述，布局路由在指定路径下渲染，子路由在布局路由中渲染。routeToken用于识别路由目录中的布局路由文件。

默认情况下，此值设置为route。

🧠 以下文件名将等于相同的运行时 URL

src/routes/posts.tsx -> /posts
src/routes/posts.route.tsx -> /posts
src/routes/posts/route.tsx -> /posts

src/routes/posts.tsx -> /posts
src/routes/posts.route.tsx -> /posts
src/routes/posts/route.tsx -> /posts

正如路由概念指南中所述，索引路由是在 URL 路径与父路由完全相同时匹配的路由。indexToken用于识别路由目录中的索引路由文件。

默认情况下，此值设置为index。

🧠 以下文件名将等于相同的运行时 URL

src/routes/posts.index.tsx -> /posts/
src/routes/posts/index.tsx -> /posts/

src/routes/posts.index.tsx -> /posts/
src/routes/posts/index.tsx -> /posts/

当您的生成路由树生成时，以及当您首次创建新路由时，这些文件将使用您在此处指定的引号样式进行格式化。

默认情况下，此值设置为single。

当您的生成路由树生成时，以及当您首次创建新路由时，如果此选项设置为true，这些文件将使用分号进行格式化。

默认情况下，此值设置为false。

此功能仅在您使用 TanStack Router Bundler 插件时可用。

此选项用于为非关键路由配置项启用自动代码拆分。有关更多信息，请参阅“自动代码拆分”指南。

默认情况下，此值设置为false。

此选项用于禁用为路由树生成类型。

如果设置为true，生成的路由树将不包含任何类型，并将作为.js文件而不是.ts文件写入。

默认情况下，此值设置为false。

此选项将文件扩展名添加到生成的路由树中的路由名称中。

默认情况下，此值设置为false。

此选项关闭路由生成过程的控制台日志记录。

默认情况下，此值设置为false。

此选项允许您将内容添加到生成的路由树文件的开头。

默认情况下，此值设置为

[
  "/* eslint-disable */",
  "// @ts-nocheck",
  "// noinspection JSUnusedGlobalSymbols"
]

[
  "/* eslint-disable */",
  "// @ts-nocheck",
  "// noinspection JSUnusedGlobalSymbols"
]

此选项允许您将内容添加到生成的路由树文件的末尾。

默认情况下，此值设置为

[]

[]

此选项打开生成路由树文件的格式化功能，这对于大型项目来说可能很耗时。

默认情况下，此值设置为true。

原子文件写入（路由文件和生成的路由树文件）通过先创建一个临时文件，然后将其重命名到实际位置来实现。

此配置选项允许配置将用于创建这些临时文件的临时目录路径。如果它是相对路径，它将解析为当前工作目录。如果未设置此值，将使用process.env.TSR_TMP_DIR。如果未设置process.env.TSR_TMP_DIR，它将默认设置为相对于当前工作目录的.tanstack/tmp。