sveltejs / sveltejs/kit

allow `config.kit.files.routes` to be an array of directories

Open
#6,031 10 comments 10 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

p3-edge-case router
Dominant language
JavaScript
Stars
20.8k
Forks
2.3k
Avg merge
1d 16h
Merged PRs (30d)
156

Description

Describe the problem

We have a multi-tenant SvelteKit project, with a directory structure like following:

src/routes/
 - index.svelte
 - about.svelte
 - terms.svelte
 - [...project1]/
    - index.svelte
 - [...project2]/
    - about.svelte

Here, we've many common routes (index, about, terms). Each project can override the common routes with a few of their custom routes (like project1 has its own index.svelte but uses the common about.svelte; and project2 has a different about.svelte but uses the common index and terms page.

Before we had the new routing system (https://github.com/sveltejs/kit/discussions/5774), we could filter out specific files from routes directory to be considered for routing using the config.kit.routes function. This was done based on build-time env variables like following:

   routes(filepath) {
      const currentProject = process.env.PROJECT_ID;
      // Exclude special folder that doesn't match current project.
      const re = /^\/\[\.\.\.(project1|project2)\]/;
      if (re.test(filepath) && filepath.match(re)[1] !== currentProject) {
        return false;
      }

      // If we've a matching route in currentProject-specific folder, exclude the common
      // filepath route. We'll end up using currentProject-specific one as `params[currentProject]` can
      // be an empty string, which SvelteKit router matches.
      // This does mean `/anything/foo` as well as `/foo resolve to same page, 
      // but we can exclude `/{anything}/foo` using route params. Hacky, but works.
      const specialRoute = path.join(`src/routes/[...${currentProject}]`, filepath);
      return !existsAsFile(specialRoute);
   },

Now, the config.kit.routes option has been removed and we can't upgrade to newer versions without major changes to our approach.

Describe the proposed solution
  • Bring back config.kit.routes option.
  • Support multiple directory in config.kit.files.routes, which can support overrides like above. This is arguably a niche use-case, but would love if this can be supported.
Alternatives considered

We can create multiple top-level routes directories and symlink/hardlink the common routes to project-specific directory, while avoiding the existing non-symlink project-specific files, to have a directory structure like:

src/
  - routes.common/
    - index.svelte
    - about.svelte
    - terms.svelte
  - routes.project1/
    - index.svelte
    - about.svelte <symlink>
    - terms.svelte <symlink>
  - routes.project2/
    - index.svelte <symlink>
    - about.svelte
    - terms.svelte <symlink>

But this might cause confusion, where we update one file and it unexpectedly ends up updating other file too. Also, it will require us to delete the symlink and create a regular file when we want to override a route.

Importance

would make my life easier

Additional Information

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reviewing the config.kit.files.routes option and the removed config.kit.routes behavior, then read routing-system discussion #5774 for context. Define how multiple route directories and project-specific overrides should behave, and verify that common routes can be selected alongside matching project routes without the old filtering option.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend, web-dev
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.