How to prevent sveltekit from treating my components as a route?

As far as I understand, to create a route in sveltekit, you need to follow these rules:

  • Create files within src/routes folder
  • Name them according to the desired path

If I need a route like https://example.com/users/:userId I need to create a [user-id].svelte file inside src/routes/users/ directory. It’s clear.

But.

What if I want all of my page-related components to live next to the page?

I would do something like this

- src/
  - routes/
    - users/
      - components/
        - avatar.svelte
      [user-id].svelte

Now, I am able to use this component as a route (e.g. https://example.com/users/components/avatar).

How to prevent this? I don’t want my components to be treated as a route

>Solution :

Files and directories prefixed with _ are ignored by SvelteKit, so you could have your component at src/routes/users/_components/avatar.svelte.

Leave a Reply