title: Sapper/Svelte: how to fetch a local json file to retrieve data
body: <p>In my sapper app, I have some data stored in a json file at src/data/videoslist.json, an array of objects in json format.</p>
  
  <p>I need to retrive the data in my index page to pass it to the component. Here's my code at the top of src/routes/index.svelte</p>
  
  <pre><code>&lt;script context="module"&gt;
      export async function preload() {
          const response = await this.fetch('../data/videoslist.json');
          const responseJson = await response.json();
          return {
              videos: responseJson
          }
      }
  &lt;/script&gt;
  </code></pre>
  
  <p>I get an error 500</p>
  
  <pre><code>invalid json response body at http://127.0.0.1:3000/data/videoslist.json reason: Unexpected token &lt; in JSON at position 0
  </code></pre>
  
  <p>The file is pure json, nothing else. The unexpected token &lt; makes me think a 404 is returned instead of the file.</p>
  
  <p>Do you know what I get wrong ? I tried so many paths variations wit ../ ./ or moving the file to the route folder, but nothing works.</p>
  
  <p>PS: I'm still a newbie with js and framework stuff, I may have missed something very basic for someone who knows better :) (like you can't retrieve a local file with fetch).</p>