SvelteKit中如何省略src/routes/layout.svelte根布局文件?
SvelteKit跳过根布局的实现方案
要省略src/routes/layout.svelte这个根布局,直接用SvelteKit的布局作用域语法就能搞定,核心是通过@标记跳过指定层级的布局继承:
- 针对单个路由或路由组,在对应目录下创建
layout@root.svelte文件。这个文件名里的@root会告诉SvelteKit:跳过最顶层的根布局,用这个文件作为当前路由/组的最外层布局。 - 如果你不需要任何自定义顶层布局,只想完全摆脱根布局,就把
layout@root.svelte写成纯插槽结构:
<slot />
这样该路由/组下的所有页面都会直接渲染内容,不会套根布局的结构。
举个实际场景:
要是你有个(public)路由组,想让组内页面都不使用根布局,就在src/routes/(public)/下新建layout@root.svelte,内容只放<slot />就行。之后(public)下的所有页面都会跳过src/routes/layout.svelte的渲染逻辑。
提醒:这个设置只会作用于当前路由/组及其子路由,其他未配置@root布局的路由还是会正常继承根布局。
内容的提问来源于stack exchange,提问作者derschiw
相关产品推荐
相关产品推荐

