realign with 0.15

app/client.js

@@ -1,7 +1,7 @@
 import { init } from 'sapper/runtime.js';
-import { routes } from './manifest/client.js';
+import { manifest } from './manifest/client.js';
 
 init({
 	target: document.querySelector('#sapper'),
-	routes
+	manifest
 });

app/server.js

@@ -2,13 +2,13 @@ import sirv from 'sirv';
 import polka from 'polka';
 import sapper from 'sapper';
 import compression from 'compression';
-import { routes } from './manifest/server.js';
+import { manifest } from './manifest/server.js';
 
 polka() // You can also use Express
 	.use(
 		compression({ threshold: 0 }),
 		sirv('assets'),
-		sapper({ routes })
+		sapper({ manifest })
 	)
 	.listen(process.env.PORT)
 	.catch(err => {

routes/_default.html

@@ -1,46 +0,0 @@
-<svelte:head>
-	<title>Sapper project template</title>
-</svelte:head>
-
-<h1>Great success!</h1>
-
-<figure>
-	<img alt='Borat' src='great-success.png'>
-	<figcaption>HIGH FIVE!</figcaption>
-</figure>
-
-<p><strong>Try editing this file (routes/index.html) to test hot module reloading.</strong></p>
-
-<style>
-	h1, figure, p {
-		text-align: center;
-		margin: 0 auto;
-	}
-
-	h1 {
-		font-size: 2.8em;
-		text-transform: uppercase;
-		font-weight: 700;
-		margin: 0 0 0.5em 0;
-	}
-
-	figure {
-		margin: 0 0 1em 0;
-	}
-
-	img {
-		width: 100%;
-		max-width: 400px;
-		margin: 0 0 1em 0;
-	}
-
-	p {
-		margin: 1em auto;
-	}
-
-	@media (min-width: 480px) {
-		h1 {
-			font-size: 4em;
-		}
-	}
-</style>

routes/_error.html

@@ -4,7 +4,7 @@
 
 <h1>{status}</h1>
 
-<p>{error.message}</p>
+<pre>{error.stack}</pre>
 
 <style>
 	h1, p {

routes/_layout.html

@@ -0,0 +1,24 @@
+<Nav segment={child.segment}/>
+
+<main>
+	<svelte:component this={child.component} {...child.props}/>
+</main>
+
+<style>
+	main {
+		position: relative;
+		max-width: 56em;
+		background-color: white;
+		padding: 2em;
+		margin: 0 auto;
+		box-sizing: border-box;
+	}
+</style>
+
+<script>
+	export default {
+		components: {
+			Nav: '../components/Nav.html'
+		}
+	};
+</script>

routes/blog/_default.html

@@ -1,32 +0,0 @@
-<svelte:head>
-	<title>Blog</title>
-</svelte:head>
-
-<h1>Recent posts</h1>
-
-<ul>
-	{#each posts as post}
-		<!-- we're using the non-standard `rel=prefetch` attribute to
-				tell Sapper to load the data for the page as soon as
-				the user hovers over the link or taps it, instead of
-				waiting for the 'click' event -->
-		<li><a rel='prefetch' href='blog/{post.slug}'>{post.title}</a></li>
-	{/each}
-</ul>
-
-<style>
-	ul {
-		margin: 0 0 1em 0;
-		line-height: 1.5;
-	}
-</style>
-
-<script>
-	export default {
-		preload({ params, query }) {
-			return this.fetch(`blog.json`).then(r => r.json()).then(posts => {
-				return { posts };
-			});
-		}
-	};
-</script>

routes/blog/index.html

@@ -1 +1,32 @@
-<svelte:component this={child.component} {...child.props}/>
+<svelte:head>
+	<title>Blog</title>
+</svelte:head>
+
+<h1>Recent posts</h1>
+
+<ul>
+	{#each posts as post}
+		<!-- we're using the non-standard `rel=prefetch` attribute to
+				tell Sapper to load the data for the page as soon as
+				the user hovers over the link or taps it, instead of
+				waiting for the 'click' event -->
+		<li><a rel='prefetch' href='blog/{post.slug}'>{post.title}</a></li>
+	{/each}
+</ul>
+
+<style>
+	ul {
+		margin: 0 0 1em 0;
+		line-height: 1.5;
+	}
+</style>
+
+<script>
+	export default {
+		preload({ params, query }) {
+			return this.fetch(`blog.json`).then(r => r.json()).then(posts => {
+				return { posts };
+			});
+		}
+	};
+</script>

routes/index.html

@@ -1,24 +1,46 @@
-<Nav segment={child.segment}/>
+<svelte:head>
+	<title>Sapper project template</title>
+</svelte:head>
 
-<main>
+<h1>Great success!</h1>
-	<svelte:component this={child.component} {...child.props}/>
+
-</main>
+<figure>
+	<img alt='Borat' src='great-success.png'>
+	<figcaption>HIGH FIVE!</figcaption>
+</figure>
+
+<p><strong>Try editing this file (routes/index.html) to test hot module reloading.</strong></p>
 
 <style>
-	main {
+	h1, figure, p {
-		position: relative;
+		text-align: center;
-		max-width: 56em;
-		background-color: white;
-		padding: 2em;
 		margin: 0 auto;
-		box-sizing: border-box;
 	}
-</style>
 
-<script>
+	h1 {
-	export default {
+		font-size: 2.8em;
-		components: {
+		text-transform: uppercase;
-			Nav: '../components/Nav.html'
+		font-weight: 700;
+		margin: 0 0 0.5em 0;
+	}
+
+	figure {
+		margin: 0 0 1em 0;
+	}
+
+	img {
+		width: 100%;
+		max-width: 400px;
+		margin: 0 0 1em 0;
+	}
+
+	p {
+		margin: 1em auto;
+	}
+
+	@media (min-width: 480px) {
+		h1 {
+			font-size: 4em;
 		}
-	};
+	}
-</script>
+</style>