Merge pull request #71 from sveltejs/0.15

[WIP] 0.15

app/client.js

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

app/server.js

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

components/Nav.html

@@ -1,11 +1,11 @@
 <nav>
 	<ul>
-		<li><a class='{path === "/"  ? "selected" : ""}' href='.'>home</a></li>
-		<li><a class='{path === "/about"  ? "selected" : ""}' href='about'>about</a></li>
+		<li><a class='{segment === undefined ? "selected" : ""}' href='.'>home</a></li>
+		<li><a class='{segment === "about" ? "selected" : ""}' href='about'>about</a></li>
 
 		<!-- for the blog link, we're using rel=prefetch so that Sapper prefetches
 		     the blog data when we hover over the link or tap it on a touchscreen -->
-		<li><a rel=prefetch class='{path.startsWith("/blog")  ? "selected" : ""}' href='blog'>blog</a></li>
+		<li><a rel=prefetch class='{segment === "blog" ? "selected" : ""}' href='blog'>blog</a></li>
 	</ul>
 </nav>
 

package.json

@@ -14,7 +14,7 @@
   "dependencies": {
     "compression": "^1.7.1",
     "polka": "^0.4.0",
-    "sapper": "^0.14.0",
+    "sapper": "^0.15.0",
     "sirv": "^0.1.1"
   },
   "devDependencies": {

routes/_layout.html

@@ -1,7 +1,7 @@
-<Nav path={props.path}/>
+<Nav segment={child.segment}/>
 
 <main>
-	<svelte:component this={Page} {...props}/>
+	<svelte:component this={child.component} {...child.props}/>
 </main>
 
 <style>
@@ -16,11 +16,9 @@
 </style>
 
 <script>
-	import Nav from '../components/Nav.html';
-
 	export default {
 		components: {
-			Nav
+			Nav: '../components/Nav.html'
 		}
 	};
 </script>