src/template.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
    <meta name="theme-color" content="#333333" />

    %sapper.base%

    <link rel="stylesheet" href="global.css" />
    <link rel="manifest" href="manifest.json" crossorigin="use-credentials" />
    <link rel="icon" type="image/png" href="favicon.svg" />
    <link rel="stylesheet" href="highlight.css" />
    <link
      rel="stylesheet"
      href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500&family=Source+Sans+Pro:wght@400;600;700;900&display=swap"
    />
    <!-- Sapper creates a <script> tag containing `src/client.js`
	     and anything else it needs to hydrate the app and
	     initialise the router -->
    %sapper.scripts%

    <!-- Sapper generates a <style> tag containing critical CSS
	     for the current page. CSS for the rest of the app is
	     lazily loaded when it precaches secondary pages -->
    %sapper.styles%

    <!-- This contains the contents of the <svelte:head> component, if
	     the current page has one -->
    %sapper.head%
  </head>

  <body>
    <!-- The application will be rendered inside this element,
	     because `src/client.js` references it -->
    <div id="sapper">%sapper.html%</div>
  </body>
</html>