文件命名约定

基于文件的路由需要您遵循一些简单的文件命名约定，以确保您的路由正确生成。这些约定所实现的概念在路由树和嵌套指南中详细介绍。

特性	描述
__root.tsx	根路由文件必须命名为__root.tsx，并且必须放置在配置的routesDirectory的根目录中。
. 分隔符	路由可以使用.字符来表示嵌套路由。例如，blog.post将被生成为blog的子路由。
$ 标记	带有$标记的路由段是参数化的，并将从URL路径名中提取值作为路由param。
_ 前缀	带有_前缀的路由段被视为无路径布局路由，在将其子路由与URL路径名匹配时将不使用它们。
_ 后缀	带有_后缀的路由段会将该路由排除在任何父路由的嵌套之外。
- 前缀	带有-前缀的文件和文件夹将从路由树中排除。它们不会添加到routeTree.gen.ts文件中，可用于在路由文件夹中协同逻辑。
(folder) 文件夹命名模式	符合此模式的文件夹将被视为路由组，从而阻止该文件夹包含在路由的URL路径中。
[x] 转义	方括号用于转义文件名中具有路由含义的特殊字符。例如，script[.]js.tsx变为/script.js，而api[.]v1.tsx变为/api.v1。
index 标记	以index标记结尾（在任何文件扩展名之前）的路由段，当URL路径名与父路由完全匹配时，将匹配父路由。这可以通过indexToken配置选项进行配置，请参阅选项。
.route.tsx 文件类型	当使用目录组织路由时，route后缀可用于在目录路径下创建路由文件。例如，blog.post.route.tsx或blog/post/route.tsx可用作/blog/post路由的路由文件。这可以通过routeToken配置选项进行配置，请参阅选项。

💡 提示：您项目的文件夹命名约定可能会受到已配置的选项的影响。

动态路径参数

动态路径参数可以用于扁平路由和目录路由，以创建可以匹配URL路径动态部分的路由。动态路径参数在文件名中用$字符表示

文件名	路由路径	组件输出
...	...	...
ʦ posts.$postId.tsx	/posts/$postId	<Root><Posts><Post>

我们将在路径参数指南中了解更多关于动态路径参数的内容。

无路径路由

无路径路由通过逻辑或组件包装子路由，而不需要URL路径。非路径路由在文件名中用_字符表示

文件名	路由路径	组件输出
ʦ _app.tsx
ʦ _app.a.tsx	/a	<Root><App><A>
ʦ _app.b.tsx	/b	<Root><App><B>

要了解有关无路径路由的更多信息，请参阅路由概念 - 无路径路由指南。

动态路径参数

无路径路由

订阅 Bytes

订阅 Bytes