Make src/routes/index.anything.js a compile error

[bbaaxx]

Describe the bug

An endpoint with a filename of routes/index.json.ts cannot be reached using a fetch from a routes/index.svelte

On the vite process I see a:

SyntaxError: Unexpected token < in JSON at position 0

The server defaults to 500 and the fetch promise fails.

Using any other name for the endpoint (like routes/other.json.ts) and pointing the fetch call to this new endpoint works as expected.

This was introduced on a recent version of @sveltejs/kit as this does not happen on previous versions this can be observed on : 1.0.0-next.260

Reproduction

• run the gernerator: npm init svelte@next my-app
• before installing deps use "@sveltejs/kit": "1.0.0-next.260"
• create a routes/index.json.ts with a handler:

import type { RequestHandler } from "@sveltejs/kit";

export const get: RequestHandler = async () => {
  return {
    status: 200,
    body: {
      user: "Dude",
    },
  };
};

• call the endpoint from routes/index.svelte

<script context="module" lang="ts">
  type Props = {
    props: {
      user: string;
    };
  };
  
  export const load = ({ fetch }): Promise<Props> =>
    fetch('/index.json') // does not work
    // fetch('/other.json') // works
      .then((res) => res.json())
      .then(({ user }) => ({ props: { user } }))
      .catch((res) => {
          console.error(res)
          return {
            status: res.status,
            error: new Error(`Could not load url`)
          };
      });
</script>

<...>

• Rename routes/index.json.ts to something different like routes/other.json.ts and adjust the fetch call and it works as expected

Logs

<can't provide the logs>

System Info

System:
    OS: macOS 12.0.1
    CPU: (8) x64 Intel(R) Core(TM) i5-1038NG7 CPU @ 2.00GHz
    Memory: 155.69 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.13.2 - ~/.nvm/versions/node/v16.13.2/bin/node
    Yarn: 1.22.17 - ~/.nvm/versions/node/v16.13.2/bin/yarn
    npm: 8.1.2 - ~/.nvm/versions/node/v16.13.2/bin/npm
  Browsers:
    Edge: 97.0.1072.55
    Safari: 15.1
  npmPackages:
    @sveltejs/adapter-auto: next => 1.0.0-next.17
    @sveltejs/kit: 1.0.0-next.260 => 1.0.0-next.260
    svelte: ^3.44.0 => 3.46.4

Severity

serious, but I can work around it

Additional Information

Reported on the help #kit-help channel too

[benmccann]

I haven't confirmed myself, but it was also mentioned on Discord that this is an example from the docs, so the docs are currently broken

[babichjacob]

The only reference I see to index.json.js in the docs is inside a folder in routes rather than directly in routes.

What path is src/routes/index.json.js expected to be accessed from, with the knowledge that src/routes/index.svelte is accessed from website.com/? website.com.json and website.com/.json are both definitely wrong, but website.com/index.json differs from the meaning index has elsewhere.

[Conduitry]

I don't know how index.something routes are treated at the root level. Generally, src/routes/foo/index.json would be a route at /foo.json. That could be part of this.

Also potentially adjacent is shadow endpoint stuff. If a GET endpoint has the same URL as a page, you can't request the endpoint unless you send Accept: application/json - although this generally shouldn't be an issue (unless you're trying to fetch the endpoint from a different page) because the response from that endpoint is automatically included as props in the page's load function without having to call it.

[Conduitry]

@babichjacob beat me to part of this by a few seconds. I'd probably argue that src/routes/index.anything.js or src/routes/index.anything.ts should probably be a compile-time error.

[Rich-Harris]

Closing as no longer necessary as of #5748