Search code examples
sveltesveltekit

Escape Root Layout Svelte Sveltekit


According to the new routing system you can now group routes and have specific layout files in each group. These files inherit for their parent layout files. You can omit this, by using [email protected].

However in want to omit the root layout file at src/routes/layout.svelte. Is there a way to do that?

(Here is the guide: https://kit.svelte.dev/docs/advanced-routing#advanced-layouts)


Solution

  • You can achieve that by using groups. Wrap all files from routes into a folder named “(app)” and other routes you don’t want to use the default layout in another group. For example, If you want to have a layout for ‘/’ and ‘/blog’ but don’t use it on ‘/login’ then you could use the following folder structure:

    src/routes/
    ├ (app)/
    │ ├ blog/
    │ │ └ +page.svelte
    │ ├ +page.svelte
    │ └ +layout.svelte
    └ (login)/
       ├ login/
       │ └ +page.svelte
       └ +layout.svelte