From 0b8b85128fde37f9bbba3e8376b98be2dade4cb7 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Sun, 11 Dec 2016 01:46:04 +0100
Subject: [PATCH 01/42] Nested dynamic routes

Build and Router
---
 lib/app/router.js  | 32 ++++++++++++++-------
 lib/build/index.js | 70 +++++++++++++++++++++++++++++-----------------
 2 files changed, 66 insertions(+), 36 deletions(-)

diff --git a/lib/app/router.js b/lib/app/router.js
index 9ac3adceb2..ef8061ad85 100644
--- a/lib/app/router.js
+++ b/lib/app/router.js
@@ -5,8 +5,27 @@ import Router from 'vue-router'
 
 Vue.use(Router)
 
-<% uniqBy(router.routes, '_name').forEach((route) => { %>
-const <%= route._name %> = process.BROWSER_BUILD ? () => System.import('<%= route._component %>') : require('<%= route._component %>')
+<%
+let components = []
+function recursiveRoutes(routes, tab) {
+  let res = ''
+  routes.forEach((route, i) => {
+    components.push({ _name: route._name, component: route.component })
+    res += tab + '{\n'
+    res += tab + '\tpath: ' + JSON.stringify(route.path) + ',\n'
+    res += tab + '\tcomponent: ' + route._name
+    res += (route.name) ? ',\n\t' + tab + 'name: ' + JSON.stringify(route.name) : ''
+    res += (route.alias) ? ',\n\t' + tab + 'alias: ' + JSON.stringify(route.alias) : ''
+    res += (route.redirect) ? ',\n\t' + tab + 'redirect: ' + JSON.stringify(route.redirect) : ''
+    res += (route.meta) ? ',\n\t' + tab + 'meta: ' + JSON.stringify(route.meta) : ''
+    res += (route.children) ? ',\n\t' + tab + 'children: [\n' + recursiveRoutes(routes[i].children, tab + '\t\t') + '\n\t' + tab + ']' : ''
+    res += '\n' + tab + '}' + (i + 1 === routes.length ? '' : ',\n')
+  })
+  return res
+}
+let routes = recursiveRoutes(router.routes, '\t\t')
+uniqBy(components, '_name').forEach((route) => { %>
+const <%= route._name %> = process.BROWSER_BUILD ? () => System.import('<%= route.component %>') : require('<%= route.component %>')
 <% }) %>
 
 const scrollBehavior = (to, from, savedPosition) => {
@@ -30,13 +49,6 @@ export default new Router({
   linkActiveClass: '<%= router.linkActiveClass %>',
   scrollBehavior,
   routes: [
-    <% router.routes.forEach((route, i) => { %>
-    {
-      path: '<%= route.path %>',
-      component: <%= route._name %><% if (route.name) { %>,
-      name: '<%= route.name %>'<% } %><% if (route.meta) { %>,
-      meta: <%= JSON.stringify(route.meta) %><% } %>
-    }<%= (i + 1 === router.routes.length ? '' : ',') %>
-    <% }) %>
+<%= routes %>
   ]
 })
diff --git a/lib/build/index.js b/lib/build/index.js
index 4957d5105e..1d8c291480 100644
--- a/lib/build/index.js
+++ b/lib/build/index.js
@@ -9,10 +9,9 @@ const hash = require('hash-sum')
 const pify = require('pify')
 const webpack = require('webpack')
 const { createBundleRenderer } = require('vue-server-renderer')
-const { join, resolve, sep, posix } = require('path')
+const { join, resolve, sep } = require('path')
 const clientWebpackConfig = require('./webpack/client.config.js')
 const serverWebpackConfig = require('./webpack/server.config.js')
-const basename = posix.basename
 const remove = pify(fs.remove)
 const readFile = pify(fs.readFile)
 const writeFile = pify(fs.writeFile)
@@ -111,13 +110,6 @@ exports.build = function * () {
   if (!this.dev) {
     yield mkdirp(r(this.dir, '.nuxt/dist'))
   }
-  // Resolve custom routes component path
-  this.options.router.routes.forEach((route) => {
-    if (route.component.slice(-4) !== '.vue') {
-      route.component = route.component + '.vue'
-    }
-    route.component = r(this.srcDir, route.component)
-  })
   // Generate routes and interpret the template files
   yield generateRoutesAndFiles.call(this)
   /*
@@ -144,15 +136,6 @@ function * generateRoutesAndFiles () {
   ** Generate routes based on files
   */
   const files = yield glob('pages/**/*.vue', { cwd: this.srcDir })
-  let routes = []
-  files.forEach((file) => {
-    let path = file.replace(/^pages/, '').replace(/index\.vue$/, '/').replace(/\.vue$/, '').replace(/\/{2,}/g, '/')
-    let name = file.replace(/^pages/, '').replace(/\.vue$/, '').replace(/\/{2,}/g, '/').split('/').slice(1).join('-')
-    if (basename(path)[0] === '_') return
-    routes.push({ path: path, component: r(this.srcDir, file), name: name })
-  })
-  // Concat pages routes and custom routes in this.routes
-  this.routes = routes.concat(this.options.router.routes)
   /*
   ** Interpret and move template files to .nuxt/
   */
@@ -192,14 +175,7 @@ function * generateRoutesAndFiles () {
     templateVars.loading = templateVars.loading + '.vue'
   }
   // Format routes for the lib/app/router.js template
-  templateVars.router.routes = this.routes.map((route) => {
-    const r = Object.assign({}, route)
-    r._component = r.component
-    r._name = '_' + hash(r._component)
-    r.component = r._name
-    r.path = r.path.replace(/\\/g, '\\\\') // regex expression in route path escaping for lodash templating
-    return r
-  })
+  templateVars.router.routes = this.routes = createRoutes(files, this.srcDir, this.options.router.routes)
   if (files.includes('pages/_app.vue')) {
     templateVars.appPath = r(this.srcDir, 'pages/_app.vue')
   }
@@ -223,6 +199,48 @@ function * generateRoutesAndFiles () {
   yield moveTemplates
 }
 
+function createRoutes (files, srcDir, options = {}) {
+  let routes = []
+  files.forEach((file) => {
+    let keys = file.replace(/^pages/, '').replace(/\.vue$/, '').replace(/\/{2,}/g, '/').split('/').slice(1)
+    let route = { name: '', path: '', component: r(srcDir, file), _name: null }
+    let parent = routes
+    keys.forEach((key, i) => {
+      route.name = route.name ? route.name + (key === 'index' ? '' : '-' + key.replace('_', '')) : key.replace('_', '')
+      let child = _.find(parent, { name: route.name })
+      if (child) {
+        if (!child.children) {
+          child.children = []
+        }
+        parent = child.children
+      } else {
+        route.path = route.path + (key === 'index' ? (i > 0 ? '' : '/') : '/' + key.replace('_', ':'))
+      }
+    })
+    route._name = '_' + hash(route.component)
+    // Update path with regexp in config
+    const path = _.result(options, keys.join('.'))
+    if (path && path.regexp) {
+      route.path = route.path.replace(_.last(keys).replace('_', ':'), path.regexp)
+    }
+    // regex expression in route path escaping for lodash templating
+    // route.path = route.path.replace(/\\/g, '\\\\')
+    parent.push(route)
+  })
+  return cleanChildrenRoutes(routes)
+}
+
+function cleanChildrenRoutes (routes, isChild = false) {
+  routes.forEach((route) => {
+    route.path = (isChild) ? route.path.replace('/', '') : route.path
+    if (route.children) {
+      delete route.name
+      route.children = cleanChildrenRoutes(route.children, true)
+    }
+  })
+  return routes
+}
+
 function getWebpackClientConfig () {
   return clientWebpackConfig.call(this)
 }

From 8870c181d7a7ec94a79474b5f0e8c94bc80cffd7 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Sun, 11 Dec 2016 02:44:40 +0100
Subject: [PATCH 02/42] Update custom route example

Build and Router
---
 examples/custom-routes/nuxt.config.js         | 24 ++++++++++++++++---
 .../custom-routes/{pages => old}/_user.vue    |  0
 examples/custom-routes/pages/comments/_id.vue |  5 ++++
 .../custom-routes/pages/comments/index.vue    |  5 ++++
 examples/custom-routes/pages/index.vue        | 18 +++++++-------
 examples/custom-routes/pages/post.vue         |  6 +++++
 examples/custom-routes/pages/post/_slug.vue   |  5 ++++
 examples/custom-routes/pages/three.vue        |  6 +++++
 examples/custom-routes/pages/three/_two.vue   |  6 +++++
 .../custom-routes/pages/three/_two/index.vue  |  5 ++++
 .../custom-routes/pages/three/_two/one.vue    |  6 +++++
 .../pages/three/_two/one/_id.vue              |  5 ++++
 12 files changed, 79 insertions(+), 12 deletions(-)
 rename examples/custom-routes/{pages => old}/_user.vue (100%)
 create mode 100644 examples/custom-routes/pages/comments/_id.vue
 create mode 100644 examples/custom-routes/pages/comments/index.vue
 create mode 100644 examples/custom-routes/pages/post.vue
 create mode 100644 examples/custom-routes/pages/post/_slug.vue
 create mode 100644 examples/custom-routes/pages/three.vue
 create mode 100644 examples/custom-routes/pages/three/_two.vue
 create mode 100644 examples/custom-routes/pages/three/_two/index.vue
 create mode 100644 examples/custom-routes/pages/three/_two/one.vue
 create mode 100644 examples/custom-routes/pages/three/_two/one/_id.vue

diff --git a/examples/custom-routes/nuxt.config.js b/examples/custom-routes/nuxt.config.js
index 9c26b5ff34..22a089e5e7 100644
--- a/examples/custom-routes/nuxt.config.js
+++ b/examples/custom-routes/nuxt.config.js
@@ -1,8 +1,26 @@
 module.exports = {
   router: {
-    routes: [
-      { name: 'user', path: '/users/:id(\\d+)', component: 'pages/_user' }
-    ]
+    // routes: [
+    //   { name: 'post-slug', path: ':slug(\\d+)' }
+    // ],
+    routes: {
+      comments: {
+        _id: {
+          regexp: ':id(\\d+)',
+          generate: [1, 2, 3, 4] // Need to be finished on generate
+        }
+      },
+      three: {
+        _two: {
+          regexp: ':two(\\d+)',
+          one: {
+            _id: {
+              regexp: ':id(\\d+)'
+            }
+          }
+        }
+      }
+    }
   },
   build: {
     vendor: ['axios']
diff --git a/examples/custom-routes/pages/_user.vue b/examples/custom-routes/old/_user.vue
similarity index 100%
rename from examples/custom-routes/pages/_user.vue
rename to examples/custom-routes/old/_user.vue
diff --git a/examples/custom-routes/pages/comments/_id.vue b/examples/custom-routes/pages/comments/_id.vue
new file mode 100644
index 0000000000..847f8d1be8
--- /dev/null
+++ b/examples/custom-routes/pages/comments/_id.vue
@@ -0,0 +1,5 @@
+<template>
+  <div>
+    Comments by Id
+  </div>
+</template>
diff --git a/examples/custom-routes/pages/comments/index.vue b/examples/custom-routes/pages/comments/index.vue
new file mode 100644
index 0000000000..b5ec94880d
--- /dev/null
+++ b/examples/custom-routes/pages/comments/index.vue
@@ -0,0 +1,5 @@
+<template>
+  <div>
+    Comments list
+  </div>
+</template>
diff --git a/examples/custom-routes/pages/index.vue b/examples/custom-routes/pages/index.vue
index 0583d602b3..06a5e8b1c1 100644
--- a/examples/custom-routes/pages/index.vue
+++ b/examples/custom-routes/pages/index.vue
@@ -2,23 +2,23 @@
   <div class="container">
     <h2>Users</h2>
     <ul class="users">
-      <li v-for="user in users">
+      <!-- <li v-for="user in users">
         <router-link :to="{ name: 'user', params: { id: user.id } }">{{ user.name }}</router-link>
-      </li>
+      </li> -->
     </ul>
   </div>
 </template>
 
 <script>
-import axios from 'axios'
+// import axios from 'axios'
 
 export default {
-  data () {
-    return axios.get('https://jsonplaceholder.typicode.com/users')
-    .then((res) => {
-      return { users: res.data }
-    })
-  }
+  // data () {
+  //   return axios.get('https://jsonplaceholder.typicode.com/users')
+  //   .then((res) => {
+  //     return { users: res.data }
+  //   })
+  // }
 }
 </script>
 
diff --git a/examples/custom-routes/pages/post.vue b/examples/custom-routes/pages/post.vue
new file mode 100644
index 0000000000..ec937ebfd2
--- /dev/null
+++ b/examples/custom-routes/pages/post.vue
@@ -0,0 +1,6 @@
+<template>
+  <div>
+    Post Layout
+    <router-view></router-view>
+  </div>
+</template>
diff --git a/examples/custom-routes/pages/post/_slug.vue b/examples/custom-routes/pages/post/_slug.vue
new file mode 100644
index 0000000000..66521230d8
--- /dev/null
+++ b/examples/custom-routes/pages/post/_slug.vue
@@ -0,0 +1,5 @@
+<template>
+  <div>
+    Post : slug
+  </div>
+</template>
diff --git a/examples/custom-routes/pages/three.vue b/examples/custom-routes/pages/three.vue
new file mode 100644
index 0000000000..1bb1022bf9
--- /dev/null
+++ b/examples/custom-routes/pages/three.vue
@@ -0,0 +1,6 @@
+<template>
+  <div>
+    Layout Three
+    <router-view></router-view>
+  </div>
+</template>
diff --git a/examples/custom-routes/pages/three/_two.vue b/examples/custom-routes/pages/three/_two.vue
new file mode 100644
index 0000000000..247186c075
--- /dev/null
+++ b/examples/custom-routes/pages/three/_two.vue
@@ -0,0 +1,6 @@
+<template>
+  <div>
+    Layout Two
+    <router-view></router-view>
+  </div>
+</template>
diff --git a/examples/custom-routes/pages/three/_two/index.vue b/examples/custom-routes/pages/three/_two/index.vue
new file mode 100644
index 0000000000..00f7a054fe
--- /dev/null
+++ b/examples/custom-routes/pages/three/_two/index.vue
@@ -0,0 +1,5 @@
+<template>
+  <div>
+    Layout Two Index    
+  </div>
+</template>
diff --git a/examples/custom-routes/pages/three/_two/one.vue b/examples/custom-routes/pages/three/_two/one.vue
new file mode 100644
index 0000000000..0237e9e92f
--- /dev/null
+++ b/examples/custom-routes/pages/three/_two/one.vue
@@ -0,0 +1,6 @@
+<template>
+  <div>
+    Layout One
+    <router-view></router-view>
+  </div>
+</template>
diff --git a/examples/custom-routes/pages/three/_two/one/_id.vue b/examples/custom-routes/pages/three/_two/one/_id.vue
new file mode 100644
index 0000000000..37b88bbdab
--- /dev/null
+++ b/examples/custom-routes/pages/three/_two/one/_id.vue
@@ -0,0 +1,5 @@
+<template>
+  <div>
+    Layout One with Id
+  </div>
+</template>

From ce0a89508e3123d59e434c5ec7ba6580327c1b0f Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Sun, 11 Dec 2016 13:34:08 +0100
Subject: [PATCH 03/42] update routes options default

---
 lib/nuxt.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/nuxt.js b/lib/nuxt.js
index 5ebd1b9a2a..f3563d3a71 100644
--- a/lib/nuxt.js
+++ b/lib/nuxt.js
@@ -42,7 +42,7 @@ class Nuxt {
       router: {
         base: '/',
         linkActiveClass: 'router-link-active',
-        routes: []
+        routes: {}
       },
       build: {}
     }

From d09fdfb78ed4b5152d98beef4a5cc53e5f9cee93 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Sun, 11 Dec 2016 16:40:18 +0100
Subject: [PATCH 04/42] scoop position nested routes

---
 examples/custom-routes/pages/comments/index.vue    |  5 -----
 .../custom-routes/pages/posts/_slug/comments.vue   |  5 +++++
 .../{old/_user.vue => pages/users/_id.vue}         | 14 ++++++++++----
 lib/app/router.js                                  |  8 +++++---
 4 files changed, 20 insertions(+), 12 deletions(-)
 delete mode 100644 examples/custom-routes/pages/comments/index.vue
 create mode 100644 examples/custom-routes/pages/posts/_slug/comments.vue
 rename examples/custom-routes/{old/_user.vue => pages/users/_id.vue} (74%)

diff --git a/examples/custom-routes/pages/comments/index.vue b/examples/custom-routes/pages/comments/index.vue
deleted file mode 100644
index b5ec94880d..0000000000
--- a/examples/custom-routes/pages/comments/index.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template>
-  <div>
-    Comments list
-  </div>
-</template>
diff --git a/examples/custom-routes/pages/posts/_slug/comments.vue b/examples/custom-routes/pages/posts/_slug/comments.vue
new file mode 100644
index 0000000000..62cdad11f6
--- /dev/null
+++ b/examples/custom-routes/pages/posts/_slug/comments.vue
@@ -0,0 +1,5 @@
+<template>
+  <div class="container">
+    Comments only
+  </div>
+</template>
diff --git a/examples/custom-routes/old/_user.vue b/examples/custom-routes/pages/users/_id.vue
similarity index 74%
rename from examples/custom-routes/old/_user.vue
rename to examples/custom-routes/pages/users/_id.vue
index 874e37d718..f0de965bdd 100644
--- a/examples/custom-routes/old/_user.vue
+++ b/examples/custom-routes/pages/users/_id.vue
@@ -1,9 +1,10 @@
 <template>
-  <div class="user">
+  <div class="container">
+    <h2>User</h2>
     <h3>{{ name }}</h3>
     <h4>@{{ username }}</h4>
     <p>Email : {{ email }}</p>
-    <p><router-link to="/">List of users</router-link></p>
+    <p><router-link to="/users">List of users</router-link></p>
   </div>
 </template>
 
@@ -22,9 +23,14 @@ export default {
 </script>
 
 <style scoped>
-.user {
+.container
+{
+  text-align: center;
+  overflow: hidden;
+}
+/*.user {
   text-align: center;
   margin-top: 100px;
   font-family: sans-serif;
-}
+}*/
 </style>
diff --git a/lib/app/router.js b/lib/app/router.js
index ef8061ad85..0ce1e29778 100644
--- a/lib/app/router.js
+++ b/lib/app/router.js
@@ -16,7 +16,6 @@ function recursiveRoutes(routes, tab) {
     res += tab + '\tcomponent: ' + route._name
     res += (route.name) ? ',\n\t' + tab + 'name: ' + JSON.stringify(route.name) : ''
     res += (route.alias) ? ',\n\t' + tab + 'alias: ' + JSON.stringify(route.alias) : ''
-    res += (route.redirect) ? ',\n\t' + tab + 'redirect: ' + JSON.stringify(route.redirect) : ''
     res += (route.meta) ? ',\n\t' + tab + 'meta: ' + JSON.stringify(route.meta) : ''
     res += (route.children) ? ',\n\t' + tab + 'children: [\n' + recursiveRoutes(routes[i].children, tab + '\t\t') + '\n\t' + tab + ']' : ''
     res += '\n' + tab + '}' + (i + 1 === routes.length ? '' : ',\n')
@@ -33,8 +32,11 @@ const scrollBehavior = (to, from, savedPosition) => {
     // savedPosition is only available for popstate navigations.
     return savedPosition
   } else {
-    // Scroll to the top by default
-    let position = { x: 0, y: 0 }
+    let position = {}
+    // if no children detected
+    if (to.matched.length < 2) {
+      position = { x: 0, y: 0 }
+    }
     // if link has anchor,  scroll to anchor by returning the selector
     if (to.hash) {
       position = { selector: to.hash }

From af36b495b053aaf692fb702dea8be9b9a3c80b35 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Sun, 11 Dec 2016 16:40:49 +0100
Subject: [PATCH 05/42] order Routes

---
 lib/build/index.js | 30 ++++++++++++++++++------------
 1 file changed, 18 insertions(+), 12 deletions(-)

diff --git a/lib/build/index.js b/lib/build/index.js
index 1d8c291480..1b1cf7a1ee 100644
--- a/lib/build/index.js
+++ b/lib/build/index.js
@@ -176,15 +176,9 @@ function * generateRoutesAndFiles () {
   }
   // Format routes for the lib/app/router.js template
   templateVars.router.routes = this.routes = createRoutes(files, this.srcDir, this.options.router.routes)
-  if (files.includes('pages/_app.vue')) {
-    templateVars.appPath = r(this.srcDir, 'pages/_app.vue')
-  }
   if (fs.existsSync(join(this.srcDir, 'layouts', 'app.vue'))) {
     templateVars.appPath = r(this.srcDir, 'layouts/app.vue')
   }
-  if (files.includes('pages/_error.vue')) {
-    templateVars.components.ErrorPage = r(this.srcDir, 'pages/_error.vue')
-  }
   if (fs.existsSync(join(this.srcDir, 'layouts', 'error.vue'))) {
     templateVars.components.ErrorPage = r(this.srcDir, 'layouts/error.vue')
   }
@@ -218,14 +212,26 @@ function createRoutes (files, srcDir, options = {}) {
       }
     })
     route._name = '_' + hash(route.component)
-    // Update path with regexp in config
+    let lastkey = _.last(keys)
     const path = _.result(options, keys.join('.'))
-    if (path && path.regexp) {
-      route.path = route.path.replace(_.last(keys).replace('_', ':'), path.regexp)
+    if (path) {
+      // Update path with regexp in config
+      if (path.regexp) {
+        route.path = route.path.replace(lastkey.replace('_', ':'), path.regexp)
+      }
+      if (path.meta) {
+        route.meta = path.meta
+      }
+      if (path.alias) {
+        route.alias = path.alias
+      }
+    }
+    // Order Routes path
+    if (lastkey[0] === '_') {
+      parent.push(route)
+    } else {
+      parent.unshift(route)
     }
-    // regex expression in route path escaping for lodash templating
-    // route.path = route.path.replace(/\\/g, '\\\\')
-    parent.push(route)
   })
   return cleanChildrenRoutes(routes)
 }

From 1ee4f9c40e130dc37915ee699688ec26154a323b Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Sun, 11 Dec 2016 16:41:52 +0100
Subject: [PATCH 06/42] update example

---
 examples/custom-routes/layouts/app.vue        | 96 +++++++++++++++++++
 examples/custom-routes/nuxt.config.js         | 38 +++-----
 examples/custom-routes/pages/comments/_id.vue |  5 -
 examples/custom-routes/pages/index.vue        | 43 +--------
 examples/custom-routes/pages/post.vue         |  6 --
 examples/custom-routes/pages/post/_slug.vue   |  5 -
 examples/custom-routes/pages/posts.vue        |  6 ++
 examples/custom-routes/pages/posts/_slug.vue  | 29 ++++++
 .../custom-routes/pages/posts/_slug/_name.vue | 16 ++++
 examples/custom-routes/pages/posts/index.vue  | 17 ++++
 .../custom-routes/pages/projects/_slug.vue    | 16 ++++
 .../custom-routes/pages/projects/index.vue    | 18 ++++
 examples/custom-routes/pages/three.vue        |  6 --
 examples/custom-routes/pages/three/_two.vue   |  6 --
 .../custom-routes/pages/three/_two/index.vue  |  5 -
 .../custom-routes/pages/three/_two/one.vue    |  6 --
 .../pages/three/_two/one/_id.vue              |  5 -
 examples/custom-routes/pages/users.vue        | 44 +++++++++
 18 files changed, 258 insertions(+), 109 deletions(-)
 create mode 100644 examples/custom-routes/layouts/app.vue
 delete mode 100644 examples/custom-routes/pages/comments/_id.vue
 delete mode 100644 examples/custom-routes/pages/post.vue
 delete mode 100644 examples/custom-routes/pages/post/_slug.vue
 create mode 100644 examples/custom-routes/pages/posts.vue
 create mode 100644 examples/custom-routes/pages/posts/_slug.vue
 create mode 100644 examples/custom-routes/pages/posts/_slug/_name.vue
 create mode 100644 examples/custom-routes/pages/posts/index.vue
 create mode 100644 examples/custom-routes/pages/projects/_slug.vue
 create mode 100644 examples/custom-routes/pages/projects/index.vue
 delete mode 100644 examples/custom-routes/pages/three.vue
 delete mode 100644 examples/custom-routes/pages/three/_two.vue
 delete mode 100644 examples/custom-routes/pages/three/_two/index.vue
 delete mode 100644 examples/custom-routes/pages/three/_two/one.vue
 delete mode 100644 examples/custom-routes/pages/three/_two/one/_id.vue
 create mode 100644 examples/custom-routes/pages/users.vue

diff --git a/examples/custom-routes/layouts/app.vue b/examples/custom-routes/layouts/app.vue
new file mode 100644
index 0000000000..f21a4b0fb8
--- /dev/null
+++ b/examples/custom-routes/layouts/app.vue
@@ -0,0 +1,96 @@
+<template>
+  <nuxt-container>
+    <nav class="Navbar clearfix">
+      <h1 class="Navbar__Title">Nuxt Custom Routes</h1>
+      <ul class="Navbar__Links">
+        <li class="Navbar__Links__Item">
+          <router-link to="/" class="Navbar__Links__Item__Link">
+            Basic route
+          </router-link>
+        </li>
+        <li class="Navbar__Links__Item">
+          <router-link to="/projects" class="Navbar__Links__Item__Link">
+            Dynamic route
+          </router-link>
+        </li>
+        <li class="Navbar__Links__Item">
+          <router-link to="/users" class="Navbar__Links__Item__Link">
+            Nested routes
+          </router-link>
+        </li>
+        <li class="Navbar__Links__Item">
+          <router-link to="/posts" class="Navbar__Links__Item__Link">
+            Dynamic nested routes
+          </router-link>
+        </li>
+      </ul>
+    </nav>
+    <nuxt/>
+  </nuxt-container>
+</template>
+
+<style>
+html, body
+{
+  font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  letter-spacing: 0.25px;
+  padding: 0;
+  margin: 0;
+}
+*, *::before, *::after
+{
+  box-sizing: border-box;
+}
+h1, h2, h3, h4, h5, h6 {
+  font-weight: 300;
+  text-align: center;
+}
+.clearfix:before, .clearfix:after
+{
+  content: " ";
+  display: table;
+}
+.clearfix:after
+{
+  clear: both;
+}
+.container {
+  margin: 30px;
+  border: 1px solid #ddd;
+}
+.Navbar
+{
+  background-color: #fff;
+  border-bottom: 1px solid #ddd;
+  margin: 0;
+  padding: 15px 30px;
+}
+.Navbar__Title
+{
+  float: left;
+  font-weight: 300;
+  margin: 0;
+}
+.Navbar__Links
+{
+  float: right;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+.Navbar__Links__Item
+{
+  float: left;
+  margin: 5px 15px;
+}
+.Navbar__Links__Item__Link
+{
+  color: #000;
+}
+a, a:hover
+{
+  text-transform: uppercase;
+  text-decoration: none;
+  color: #41B883;
+}
+</style>
diff --git a/examples/custom-routes/nuxt.config.js b/examples/custom-routes/nuxt.config.js
index 22a089e5e7..736b2d8573 100644
--- a/examples/custom-routes/nuxt.config.js
+++ b/examples/custom-routes/nuxt.config.js
@@ -1,27 +1,19 @@
 module.exports = {
-  router: {
-    // routes: [
-    //   { name: 'post-slug', path: ':slug(\\d+)' }
-    // ],
-    routes: {
-      comments: {
-        _id: {
-          regexp: ':id(\\d+)',
-          generate: [1, 2, 3, 4] // Need to be finished on generate
-        }
-      },
-      three: {
-        _two: {
-          regexp: ':two(\\d+)',
-          one: {
-            _id: {
-              regexp: ':id(\\d+)'
-            }
-          }
-        }
-      }
-    }
-  },
+  // router: {
+  //   routes: {
+  //     users: {
+  //       _id: {
+  //         regexp: ':id(\\d+)',
+  //         alias: '/author/:authorid/post/:id'
+  //         // generate: [1, 2, 3, 4] // Need to be finished on generate
+  //       },
+  //       meta: {
+  //         title: 'users'
+  //       },
+  //       alias: '/author/:authorid/post'
+  //     }
+  //   }
+  // },
   build: {
     vendor: ['axios']
   }
diff --git a/examples/custom-routes/pages/comments/_id.vue b/examples/custom-routes/pages/comments/_id.vue
deleted file mode 100644
index 847f8d1be8..0000000000
--- a/examples/custom-routes/pages/comments/_id.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template>
-  <div>
-    Comments by Id
-  </div>
-</template>
diff --git a/examples/custom-routes/pages/index.vue b/examples/custom-routes/pages/index.vue
index 06a5e8b1c1..402d232bc3 100644
--- a/examples/custom-routes/pages/index.vue
+++ b/examples/custom-routes/pages/index.vue
@@ -1,46 +1,5 @@
 <template>
   <div class="container">
-    <h2>Users</h2>
-    <ul class="users">
-      <!-- <li v-for="user in users">
-        <router-link :to="{ name: 'user', params: { id: user.id } }">{{ user.name }}</router-link>
-      </li> -->
-    </ul>
+    <h2>Home</h2>
   </div>
 </template>
-
-<script>
-// import axios from 'axios'
-
-export default {
-  // data () {
-  //   return axios.get('https://jsonplaceholder.typicode.com/users')
-  //   .then((res) => {
-  //     return { users: res.data }
-  //   })
-  // }
-}
-</script>
-
-<style scoped>
-.container {
-  text-align: center;
-  margin-top: 100px;
-  font-family: sans-serif;
-}
-.users {
-  list-style-type: none;
-}
-.users li a {
-  display: inline-block;
-  width: 200px;
-  border: 1px #ddd solid;
-  padding: 10px;
-  text-align: left;
-  color: #222;
-  text-decoration: none;
-}
-.users li a:hover {
-  color: orange;
-}
-</style>
diff --git a/examples/custom-routes/pages/post.vue b/examples/custom-routes/pages/post.vue
deleted file mode 100644
index ec937ebfd2..0000000000
--- a/examples/custom-routes/pages/post.vue
+++ /dev/null
@@ -1,6 +0,0 @@
-<template>
-  <div>
-    Post Layout
-    <router-view></router-view>
-  </div>
-</template>
diff --git a/examples/custom-routes/pages/post/_slug.vue b/examples/custom-routes/pages/post/_slug.vue
deleted file mode 100644
index 66521230d8..0000000000
--- a/examples/custom-routes/pages/post/_slug.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template>
-  <div>
-    Post : slug
-  </div>
-</template>
diff --git a/examples/custom-routes/pages/posts.vue b/examples/custom-routes/pages/posts.vue
new file mode 100644
index 0000000000..946ca2731f
--- /dev/null
+++ b/examples/custom-routes/pages/posts.vue
@@ -0,0 +1,6 @@
+<template>
+  <div class="container">
+    <h1>Dynamic nested route example</h1>
+    <router-view></router-view>
+  </div>
+</template>
diff --git a/examples/custom-routes/pages/posts/_slug.vue b/examples/custom-routes/pages/posts/_slug.vue
new file mode 100644
index 0000000000..8fb06ed47b
--- /dev/null
+++ b/examples/custom-routes/pages/posts/_slug.vue
@@ -0,0 +1,29 @@
+<template>
+  <div class="container">
+    <h2>Post : {{ $route.params.slug }}</h2>
+    <p>
+      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+    </p>
+    <p>
+      <router-link :to="{ name: 'posts-slug-name', params: { name: 'foo'} }">
+        Foo
+      </router-link>
+      <router-link :to="{ name: 'posts-slug-name', params: { name: 'bar'} }">
+        Bar
+      </router-link>
+    </p>
+    <router-view></router-view>
+  </div>
+</template>
+
+<style scoped>
+p
+{
+  text-align: center;
+  padding: 15px 30px;
+}
+a
+{
+  margin: 0 15px;
+}
+</style>
diff --git a/examples/custom-routes/pages/posts/_slug/_name.vue b/examples/custom-routes/pages/posts/_slug/_name.vue
new file mode 100644
index 0000000000..17379f0182
--- /dev/null
+++ b/examples/custom-routes/pages/posts/_slug/_name.vue
@@ -0,0 +1,16 @@
+<template>
+  <div class="container">
+    <h2>{{ $route.params.name }}</h2>
+    <p>
+      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+    </p>
+  </div>
+</template>
+
+<style scoped>
+p
+{
+  text-align: center;
+  padding: 15px 30px;
+}
+</style>
diff --git a/examples/custom-routes/pages/posts/index.vue b/examples/custom-routes/pages/posts/index.vue
new file mode 100644
index 0000000000..cdc4114f57
--- /dev/null
+++ b/examples/custom-routes/pages/posts/index.vue
@@ -0,0 +1,17 @@
+<template>
+  <div class="container">
+    <h2>Posts list</h2>
+    <p>
+      <router-link to="/posts/welcome">
+        Welcome post
+      </router-link>
+    </p>
+  </div>
+</template>
+
+<style scoped>
+p
+{
+  text-align: center;
+}
+</style>
diff --git a/examples/custom-routes/pages/projects/_slug.vue b/examples/custom-routes/pages/projects/_slug.vue
new file mode 100644
index 0000000000..0b1fba7bc0
--- /dev/null
+++ b/examples/custom-routes/pages/projects/_slug.vue
@@ -0,0 +1,16 @@
+<template>
+  <div class="container">
+    <h1>Dynamic route example</h1>
+    <h2>Project : {{ $route.params.slug }}</h2>
+    <p>
+      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+    </p>
+  </div>
+</template>
+
+<style scoped>
+p
+{
+  padding: 15px 30px;
+}
+</style>
diff --git a/examples/custom-routes/pages/projects/index.vue b/examples/custom-routes/pages/projects/index.vue
new file mode 100644
index 0000000000..152b470ab6
--- /dev/null
+++ b/examples/custom-routes/pages/projects/index.vue
@@ -0,0 +1,18 @@
+<template>
+  <div class="container">
+    <h1>Dynamic route example</h1>
+    <h2>Projects list</h2>
+    <p>
+      <router-link :to="{ name: 'projects-slug', params: { slug: 'nuxt.js'} }">
+        Nuxt.js
+      </router-link>
+    </p>
+  </div>
+</template>
+
+<style scoped>
+p
+{
+  text-align: center;
+}
+</style>
diff --git a/examples/custom-routes/pages/three.vue b/examples/custom-routes/pages/three.vue
deleted file mode 100644
index 1bb1022bf9..0000000000
--- a/examples/custom-routes/pages/three.vue
+++ /dev/null
@@ -1,6 +0,0 @@
-<template>
-  <div>
-    Layout Three
-    <router-view></router-view>
-  </div>
-</template>
diff --git a/examples/custom-routes/pages/three/_two.vue b/examples/custom-routes/pages/three/_two.vue
deleted file mode 100644
index 247186c075..0000000000
--- a/examples/custom-routes/pages/three/_two.vue
+++ /dev/null
@@ -1,6 +0,0 @@
-<template>
-  <div>
-    Layout Two
-    <router-view></router-view>
-  </div>
-</template>
diff --git a/examples/custom-routes/pages/three/_two/index.vue b/examples/custom-routes/pages/three/_two/index.vue
deleted file mode 100644
index 00f7a054fe..0000000000
--- a/examples/custom-routes/pages/three/_two/index.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template>
-  <div>
-    Layout Two Index    
-  </div>
-</template>
diff --git a/examples/custom-routes/pages/three/_two/one.vue b/examples/custom-routes/pages/three/_two/one.vue
deleted file mode 100644
index 0237e9e92f..0000000000
--- a/examples/custom-routes/pages/three/_two/one.vue
+++ /dev/null
@@ -1,6 +0,0 @@
-<template>
-  <div>
-    Layout One
-    <router-view></router-view>
-  </div>
-</template>
diff --git a/examples/custom-routes/pages/three/_two/one/_id.vue b/examples/custom-routes/pages/three/_two/one/_id.vue
deleted file mode 100644
index 37b88bbdab..0000000000
--- a/examples/custom-routes/pages/three/_two/one/_id.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template>
-  <div>
-    Layout One with Id
-  </div>
-</template>
diff --git a/examples/custom-routes/pages/users.vue b/examples/custom-routes/pages/users.vue
new file mode 100644
index 0000000000..fd27a76b20
--- /dev/null
+++ b/examples/custom-routes/pages/users.vue
@@ -0,0 +1,44 @@
+<template>
+  <div class="container clearfix">
+    <h1>Nested routes example</h1>
+    <h2>Users list</h2>
+    <ul class="users">
+      <li v-for="user in users">
+        <router-link :to="{ name: 'users-id', params: { id: user.id } }">{{ user.name }}</router-link>
+      </li>
+    </ul>
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+import axios from 'axios'
+
+export default {
+  data () {
+    return axios.get('https://jsonplaceholder.typicode.com/users')
+    .then((res) => {
+      return { users: res.data }
+    })
+  }
+}
+</script>
+
+<style scoped>
+.users {
+  float: left;
+  list-style-type: none;
+}
+.users li a {
+  display: inline-block;
+  width: 200px;
+  border: 1px #ddd solid;
+  padding: 10px;
+  text-align: left;
+  color: #222;
+  text-decoration: none;
+}
+.users li a:hover {
+  color: orange;
+}
+</style>

From ae2bf1022127f4332566cd0af3e9d1fc76d04f57 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Sun, 11 Dec 2016 17:10:35 +0100
Subject: [PATCH 07/42] nested data example update

---
 examples/custom-routes/pages/users.vue     |  6 +++++-
 examples/custom-routes/pages/users/_id.vue | 17 +++++++++++++----
 2 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/examples/custom-routes/pages/users.vue b/examples/custom-routes/pages/users.vue
index fd27a76b20..ce77a3dcbf 100644
--- a/examples/custom-routes/pages/users.vue
+++ b/examples/custom-routes/pages/users.vue
@@ -26,6 +26,7 @@ export default {
 
 <style scoped>
 .users {
+  margin: 10px 0;
   float: left;
   list-style-type: none;
 }
@@ -39,6 +40,9 @@ export default {
   text-decoration: none;
 }
 .users li a:hover {
-  color: orange;
+  color: #41b883;
+}
+.router-link-active {
+  color: #41b883 !important;
 }
 </style>
diff --git a/examples/custom-routes/pages/users/_id.vue b/examples/custom-routes/pages/users/_id.vue
index f0de965bdd..63b5d6c73a 100644
--- a/examples/custom-routes/pages/users/_id.vue
+++ b/examples/custom-routes/pages/users/_id.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="container">
     <h2>User</h2>
-    <h3>{{ name }}</h3>
-    <h4>@{{ username }}</h4>
-    <p>Email : {{ email }}</p>
+    <h3>{{ user.name }}</h3>
+    <h4>@{{ user.username }}</h4>
+    <p>Email : {{ user.email }}</p>
     <p><router-link to="/users">List of users</router-link></p>
   </div>
 </template>
@@ -14,10 +14,18 @@ import axios from 'axios'
 export default {
   data ({ params, error }) {
     return axios.get(`https://jsonplaceholder.typicode.com/users/${params.id}`)
-    .then((res) => res.data)
+    .then((res) => { return { user: res.data } })
     .catch(() => {
       error({ message: 'User not found', statusCode: 404 })
     })
+  },
+  watch: {
+    $route () {
+      return axios.get(`https://jsonplaceholder.typicode.com/users/${this.$route.params.id}`)
+      .then((res) => {
+        this.user = res.data
+      })
+    }
   }
 }
 </script>
@@ -27,6 +35,7 @@ export default {
 {
   text-align: center;
   overflow: hidden;
+  min-height: 440px;
 }
 /*.user {
   text-align: center;

From 9d59a2f80fc6ba90f764984fe1fe394acd0e276c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Sun, 11 Dec 2016 18:58:47 +0100
Subject: [PATCH 08/42] remove strict mode for node v4

---
 lib/nuxt.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/lib/nuxt.js b/lib/nuxt.js
index f3563d3a71..065e1d7ab7 100644
--- a/lib/nuxt.js
+++ b/lib/nuxt.js
@@ -1,5 +1,3 @@
-'use strict'
-
 const _ = require('lodash')
 const co = require('co')
 const fs = require('fs-extra')

From cc1592634075e57564d604fd38080ad8328bce42 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Mon, 12 Dec 2016 00:15:13 +0100
Subject: [PATCH 09/42] update example

---
 examples/custom-routes/layouts/app.vue  |  8 ++++--
 examples/custom-routes/nuxt.config.js   | 34 +++++++++++++++----------
 examples/custom-routes/pages/author.vue | 19 ++++++++++++++
 examples/custom-routes/pages/index.vue  |  5 +++-
 4 files changed, 50 insertions(+), 16 deletions(-)
 create mode 100644 examples/custom-routes/pages/author.vue

diff --git a/examples/custom-routes/layouts/app.vue b/examples/custom-routes/layouts/app.vue
index f21a4b0fb8..7bf1554099 100644
--- a/examples/custom-routes/layouts/app.vue
+++ b/examples/custom-routes/layouts/app.vue
@@ -1,10 +1,14 @@
 <template>
   <nuxt-container>
     <nav class="Navbar clearfix">
-      <h1 class="Navbar__Title">Nuxt Custom Routes</h1>
+      <h1 class="Navbar__Title">
+        <router-link to="/" class="Navbar__Links__Item__Link">
+          Nuxt Custom Routes
+        </router-link>
+      </h1>
       <ul class="Navbar__Links">
         <li class="Navbar__Links__Item">
-          <router-link to="/" class="Navbar__Links__Item__Link">
+          <router-link to="/author" class="Navbar__Links__Item__Link">
             Basic route
           </router-link>
         </li>
diff --git a/examples/custom-routes/nuxt.config.js b/examples/custom-routes/nuxt.config.js
index 736b2d8573..eb87411f1b 100644
--- a/examples/custom-routes/nuxt.config.js
+++ b/examples/custom-routes/nuxt.config.js
@@ -1,17 +1,25 @@
 module.exports = {
-  // router: {
-  //   routes: {
-  //     users: {
-  //       _id: {
-  //         regexp: ':id(\\d+)',
-  //         alias: '/author/:authorid/post/:id'
-  //         // generate: [1, 2, 3, 4] // Need to be finished on generate
-  //       },
-  //       meta: {
-  //         title: 'users'
-  //       },
-  //       alias: '/author/:authorid/post'
-  //     }
+  router: {
+    routes: {
+      author: {
+        alias: '/nuxt'
+      },
+      users: {
+        _id: {
+          regexp: ':id(\\d+)'
+          // generate: [1, 2, 3, 4] // Need to be finished on generate
+        }
+      },
+      posts: {
+        alias: '/articles'
+      }
+    }
+  },
+  // generate: {
+  //   routeParams: {
+  //     '/guide/:slug': _(require('./static/docs/guide/menu.json')).values().flatten().map('to').compact().map((slug) => { return { slug: slug.replace(/^\//, '') } }).value(),
+  //     '/api/:slug': _(require('./static/docs/api/menu.json')).values().flatten().map('to').compact().map((slug) => { return { slug: slug.replace(/^\//, '') } }).value(),
+  //     '/examples/:slug': _(require('./static/docs/examples/menu.json')).values().flatten().map('to').compact().map((slug) => { return { slug: slug.replace(/^\//, '') } }).value()
   //   }
   // },
   build: {
diff --git a/examples/custom-routes/pages/author.vue b/examples/custom-routes/pages/author.vue
new file mode 100644
index 0000000000..d4a341e5a7
--- /dev/null
+++ b/examples/custom-routes/pages/author.vue
@@ -0,0 +1,19 @@
+<template>
+  <div class="container">
+    <h1>Basic route with Alias</h1>
+    <router-link to="/nuxt" class="Navbar__Links__Item__Link" v-if="$route.path === '/author'">
+      This route is also available on /nuxt
+    </router-link>
+    <router-link to="/author" class="Navbar__Links__Item__Link" v-else>
+      This route is also available on /author
+    </router-link>
+  </div>
+</template>
+
+<style scoped>
+.container
+{
+  text-align: center;
+  padding-bottom: 30px;
+}
+</style>
diff --git a/examples/custom-routes/pages/index.vue b/examples/custom-routes/pages/index.vue
index 402d232bc3..99e38858f6 100644
--- a/examples/custom-routes/pages/index.vue
+++ b/examples/custom-routes/pages/index.vue
@@ -1,5 +1,8 @@
 <template>
   <div class="container">
-    <h2>Home</h2>
+    <h1>Home</h1>
+    <h2>
+      Examples of custom routes
+    </h2>
   </div>
 </template>

From 32a6f3011891bf413e3bb2f1bc042e4d5d43016e Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Mon, 12 Dec 2016 14:16:47 +0100
Subject: [PATCH 10/42] delete option routes.router

---
 examples/custom-routes/nuxt.config.js | 24 ++++++++++++------------
 lib/app/router.js                     |  2 --
 lib/build/index.js                    | 20 +++-----------------
 3 files changed, 15 insertions(+), 31 deletions(-)

diff --git a/examples/custom-routes/nuxt.config.js b/examples/custom-routes/nuxt.config.js
index eb87411f1b..38fa87ebb2 100644
--- a/examples/custom-routes/nuxt.config.js
+++ b/examples/custom-routes/nuxt.config.js
@@ -1,18 +1,18 @@
 module.exports = {
   router: {
     routes: {
-      author: {
-        alias: '/nuxt'
-      },
-      users: {
-        _id: {
-          regexp: ':id(\\d+)'
-          // generate: [1, 2, 3, 4] // Need to be finished on generate
-        }
-      },
-      posts: {
-        alias: '/articles'
-      }
+      // author: {
+      //   alias: '/nuxt'
+      // },
+      // users: {
+      //   _id: {
+      //     regexp: ':id(\\d+)'
+      //     // generate: [1, 2, 3, 4] // Need to be finished on generate
+      //   }
+      // },
+      // posts: {
+      //   alias: '/articles'
+      // }
     }
   },
   // generate: {
diff --git a/lib/app/router.js b/lib/app/router.js
index 0ce1e29778..7c94ceba75 100644
--- a/lib/app/router.js
+++ b/lib/app/router.js
@@ -15,8 +15,6 @@ function recursiveRoutes(routes, tab) {
     res += tab + '\tpath: ' + JSON.stringify(route.path) + ',\n'
     res += tab + '\tcomponent: ' + route._name
     res += (route.name) ? ',\n\t' + tab + 'name: ' + JSON.stringify(route.name) : ''
-    res += (route.alias) ? ',\n\t' + tab + 'alias: ' + JSON.stringify(route.alias) : ''
-    res += (route.meta) ? ',\n\t' + tab + 'meta: ' + JSON.stringify(route.meta) : ''
     res += (route.children) ? ',\n\t' + tab + 'children: [\n' + recursiveRoutes(routes[i].children, tab + '\t\t') + '\n\t' + tab + ']' : ''
     res += '\n' + tab + '}' + (i + 1 === routes.length ? '' : ',\n')
   })
diff --git a/lib/build/index.js b/lib/build/index.js
index 1b1cf7a1ee..a5eee551b4 100644
--- a/lib/build/index.js
+++ b/lib/build/index.js
@@ -175,7 +175,7 @@ function * generateRoutesAndFiles () {
     templateVars.loading = templateVars.loading + '.vue'
   }
   // Format routes for the lib/app/router.js template
-  templateVars.router.routes = this.routes = createRoutes(files, this.srcDir, this.options.router.routes)
+  templateVars.router.routes = this.routes = createRoutes(files, this.srcDir)
   if (fs.existsSync(join(this.srcDir, 'layouts', 'app.vue'))) {
     templateVars.appPath = r(this.srcDir, 'layouts/app.vue')
   }
@@ -193,7 +193,7 @@ function * generateRoutesAndFiles () {
   yield moveTemplates
 }
 
-function createRoutes (files, srcDir, options = {}) {
+function createRoutes (files, srcDir) {
   let routes = []
   files.forEach((file) => {
     let keys = file.replace(/^pages/, '').replace(/\.vue$/, '').replace(/\/{2,}/g, '/').split('/').slice(1)
@@ -212,22 +212,8 @@ function createRoutes (files, srcDir, options = {}) {
       }
     })
     route._name = '_' + hash(route.component)
-    let lastkey = _.last(keys)
-    const path = _.result(options, keys.join('.'))
-    if (path) {
-      // Update path with regexp in config
-      if (path.regexp) {
-        route.path = route.path.replace(lastkey.replace('_', ':'), path.regexp)
-      }
-      if (path.meta) {
-        route.meta = path.meta
-      }
-      if (path.alias) {
-        route.alias = path.alias
-      }
-    }
     // Order Routes path
-    if (lastkey[0] === '_') {
+    if (_.last(keys)[0] === '_') {
       parent.push(route)
     } else {
       parent.unshift(route)

From f8c7b5c0121b72fdf928fa2fdb1318156cf0c3e4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Mon, 12 Dec 2016 16:30:07 +0100
Subject: [PATCH 11/42] Add validate option

---
 examples/custom-routes/nuxt.config.js         | 23 -------------------
 .../custom-routes/pages/projects/_slug.vue    |  8 +++++++
 .../custom-routes/pages/projects/index.vue    |  2 +-
 lib/app/client.js                             | 12 ++++++++++
 lib/app/router.js                             | 14 +++++------
 lib/app/server.js                             | 22 ++++++++++++++++--
 6 files changed, 48 insertions(+), 33 deletions(-)

diff --git a/examples/custom-routes/nuxt.config.js b/examples/custom-routes/nuxt.config.js
index 38fa87ebb2..bb0765f744 100644
--- a/examples/custom-routes/nuxt.config.js
+++ b/examples/custom-routes/nuxt.config.js
@@ -1,27 +1,4 @@
 module.exports = {
-  router: {
-    routes: {
-      // author: {
-      //   alias: '/nuxt'
-      // },
-      // users: {
-      //   _id: {
-      //     regexp: ':id(\\d+)'
-      //     // generate: [1, 2, 3, 4] // Need to be finished on generate
-      //   }
-      // },
-      // posts: {
-      //   alias: '/articles'
-      // }
-    }
-  },
-  // generate: {
-  //   routeParams: {
-  //     '/guide/:slug': _(require('./static/docs/guide/menu.json')).values().flatten().map('to').compact().map((slug) => { return { slug: slug.replace(/^\//, '') } }).value(),
-  //     '/api/:slug': _(require('./static/docs/api/menu.json')).values().flatten().map('to').compact().map((slug) => { return { slug: slug.replace(/^\//, '') } }).value(),
-  //     '/examples/:slug': _(require('./static/docs/examples/menu.json')).values().flatten().map('to').compact().map((slug) => { return { slug: slug.replace(/^\//, '') } }).value()
-  //   }
-  // },
   build: {
     vendor: ['axios']
   }
diff --git a/examples/custom-routes/pages/projects/_slug.vue b/examples/custom-routes/pages/projects/_slug.vue
index 0b1fba7bc0..bc9ae4ecd1 100644
--- a/examples/custom-routes/pages/projects/_slug.vue
+++ b/examples/custom-routes/pages/projects/_slug.vue
@@ -8,6 +8,14 @@
   </div>
 </template>
 
+<script>
+export default {
+  validate ({ params }) {
+    return /^[A-z]+$/.test(params.slug)
+  }
+}
+</script>
+
 <style scoped>
 p
 {
diff --git a/examples/custom-routes/pages/projects/index.vue b/examples/custom-routes/pages/projects/index.vue
index 152b470ab6..4a1026b0cd 100644
--- a/examples/custom-routes/pages/projects/index.vue
+++ b/examples/custom-routes/pages/projects/index.vue
@@ -3,7 +3,7 @@
     <h1>Dynamic route example</h1>
     <h2>Projects list</h2>
     <p>
-      <router-link :to="{ name: 'projects-slug', params: { slug: 'nuxt.js'} }">
+      <router-link :to="{ name: 'projects-slug', params: { slug: 'nuxtjs'} }">
         Nuxt.js
       </router-link>
     </p>
diff --git a/lib/app/client.js b/lib/app/client.js
index c5f9dafaf4..a9a2c2cf2a 100644
--- a/lib/app/client.js
+++ b/lib/app/client.js
@@ -70,6 +70,17 @@ function render (to, ___, next) {
   this.setTransition(Components[0].options.transition)
   this.error()
   let nextCalled = false
+  let isValid = Components.some((Component) => {
+    if (typeof Component.options.validate !== 'function') return true
+    return Component.options.validate({
+      params: to.params || {},
+      query: to.query || {}
+    })
+  })
+  if (!isValid) {
+    this.error({ statusCode: 404, message: 'This page could not be found.', url: to.path })
+    return next()
+  }
   Promise.all(Components.map((Component) => {
     let promises = []
     const _next = function (path) {
@@ -78,6 +89,7 @@ function render (to, ___, next) {
       next(path)
     }
     const context = getContext({ to<%= (store ? ', store' : '') %>, isClient: true, next: _next.bind(this), error: this.error.bind(this) })
+    // Validate method
     if (Component._data && typeof Component._data === 'function') {
       var promise = promisify(Component._data, context)
       promise.then((data) => {
diff --git a/lib/app/router.js b/lib/app/router.js
index 7c94ceba75..e603f68cb4 100644
--- a/lib/app/router.js
+++ b/lib/app/router.js
@@ -6,22 +6,22 @@ import Router from 'vue-router'
 Vue.use(Router)
 
 <%
-let components = []
-function recursiveRoutes(routes, tab) {
-  let res = ''
+function recursiveRoutes(routes, tab, components) {
+  var res = ''
   routes.forEach((route, i) => {
     components.push({ _name: route._name, component: route.component })
     res += tab + '{\n'
     res += tab + '\tpath: ' + JSON.stringify(route.path) + ',\n'
     res += tab + '\tcomponent: ' + route._name
     res += (route.name) ? ',\n\t' + tab + 'name: ' + JSON.stringify(route.name) : ''
-    res += (route.children) ? ',\n\t' + tab + 'children: [\n' + recursiveRoutes(routes[i].children, tab + '\t\t') + '\n\t' + tab + ']' : ''
+    res += (route.children) ? ',\n\t' + tab + 'children: [\n' + recursiveRoutes(routes[i].children, tab + '\t\t', components) + '\n\t' + tab + ']' : ''
     res += '\n' + tab + '}' + (i + 1 === routes.length ? '' : ',\n')
   })
   return res
 }
-let routes = recursiveRoutes(router.routes, '\t\t')
-uniqBy(components, '_name').forEach((route) => { %>
+var _components = []
+var _routes = recursiveRoutes(router.routes, '\t\t', _components)
+uniqBy(_components, '_name').forEach((route) => { %>
 const <%= route._name %> = process.BROWSER_BUILD ? () => System.import('<%= route.component %>') : require('<%= route.component %>')
 <% }) %>
 
@@ -49,6 +49,6 @@ export default new Router({
   linkActiveClass: '<%= router.linkActiveClass %>',
   scrollBehavior,
   routes: [
-<%= routes %>
+<%= _routes %>
   ]
 })
diff --git a/lib/app/server.js b/lib/app/server.js
index 5e4af2e53b..ea7e4a74e4 100644
--- a/lib/app/server.js
+++ b/lib/app/server.js
@@ -60,8 +60,8 @@ export default context => {
   <% } %>
   return promise
   .then(() => {
-    // Call data & fetch hooks on components matched by the route.
-    return Promise.all(Components.map((Component) => {
+    // Sanitize Components
+    Components = Components.map((Component) => {
       let promises = []
       if (!Component.options) {
         Component = Vue.extend(Component)
@@ -70,6 +70,24 @@ export default context => {
         Component._Ctor = Component
         Component.extendOptions = Component.options
       }
+      return Component
+    })
+    // Call .validate()
+    let isValid = Components.some((Component) => {
+      if (typeof Component.options.validate !== 'function') return true
+      return Component.options.validate({
+        params: context.route.params || {},
+        query: context.route.query || {}
+      })
+    })
+    if (!isValid) {
+      // Call the 404 error by making the Components array empty
+      Components = []
+      return _app
+    }
+    // Call data & fetch hooks on components matched by the route.
+    return Promise.all(Components.map((Component) => {
+      let promises = []
       const ctx = getContext(context)
       if (Component.options.data && typeof Component.options.data === 'function') {
         Component._data = Component.options.data

From b71b8b74787df4a4b9f7e7f3b22ab5287fceba18 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Mon, 12 Dec 2016 16:30:17 +0100
Subject: [PATCH 12/42] Add .json extension

---
 lib/build/webpack/base.config.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/build/webpack/base.config.js b/lib/build/webpack/base.config.js
index aa7d868011..b92efeeff7 100644
--- a/lib/build/webpack/base.config.js
+++ b/lib/build/webpack/base.config.js
@@ -24,7 +24,7 @@ module.exports = function () {
       publicPath: urlJoin(this.options.router.base, '/_nuxt/')
     },
     resolve: {
-      extensions: ['.js', '.vue'],
+      extensions: ['.js', '.json', '.vue'],
       // Disable for now
       alias: {
         '~': join(this.srcDir),

From da9c311b5429707bd13681da226a1d970bcb2313 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Mon, 12 Dec 2016 21:16:12 +0100
Subject: [PATCH 13/42] generate routes flatten

---
 lib/build/index.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/lib/build/index.js b/lib/build/index.js
index a5eee551b4..a1bf94b98f 100644
--- a/lib/build/index.js
+++ b/lib/build/index.js
@@ -136,6 +136,9 @@ function * generateRoutesAndFiles () {
   ** Generate routes based on files
   */
   const files = yield glob('pages/**/*.vue', { cwd: this.srcDir })
+  this.routes = _.uniq(_.map(files, (file) => {
+    return file.replace(/^pages/, '').replace(/\.vue$/, '').replace('/index', '').replace('_', ':').replace('', '/').replace(/\/{2,}/g, '/')
+  }))
   /*
   ** Interpret and move template files to .nuxt/
   */
@@ -175,7 +178,7 @@ function * generateRoutesAndFiles () {
     templateVars.loading = templateVars.loading + '.vue'
   }
   // Format routes for the lib/app/router.js template
-  templateVars.router.routes = this.routes = createRoutes(files, this.srcDir)
+  templateVars.router.routes = createRoutes(files, this.srcDir)
   if (fs.existsSync(join(this.srcDir, 'layouts', 'app.vue'))) {
     templateVars.appPath = r(this.srcDir, 'layouts/app.vue')
   }

From 2c4a512dda7329a1a1317ab03dd33764c63f0492 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Mon, 12 Dec 2016 21:54:02 +0100
Subject: [PATCH 14/42] generate ok

---
 examples/custom-routes/nuxt.config.js |  9 +++++++++
 lib/build/index.js                    |  2 +-
 lib/generate.js                       | 14 +++++++-------
 3 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/examples/custom-routes/nuxt.config.js b/examples/custom-routes/nuxt.config.js
index bb0765f744..3ca5309ed5 100644
--- a/examples/custom-routes/nuxt.config.js
+++ b/examples/custom-routes/nuxt.config.js
@@ -1,5 +1,14 @@
 module.exports = {
   build: {
     vendor: ['axios']
+  },
+  generate: {
+    routeParams: {
+      '/users/:id': [{id: 1}, {id: 2}, {id: 3}, {id: 4}, {id: 5}],
+      '/posts/:slug': [{slug: 'welcome'}, {slug: 'foo'}, {slug: 'bar'}],
+      '/posts/:slug/comments': [{slug: 'welcome'}, {slug: 'foo'}, {slug: 'bar'}],
+      '/posts/:slug/:name': [{slug: 'welcome', name: 'a'}, {slug: 'foo', name: 'b'}, {slug: 'bar', name: 'a'}],
+      '/projects/:slug': [{slug: 'toto'}, {slug: 'titi'}, {slug: 'tutu'}]
+    }
   }
 }
diff --git a/lib/build/index.js b/lib/build/index.js
index a1bf94b98f..8fd05707de 100644
--- a/lib/build/index.js
+++ b/lib/build/index.js
@@ -137,7 +137,7 @@ function * generateRoutesAndFiles () {
   */
   const files = yield glob('pages/**/*.vue', { cwd: this.srcDir })
   this.routes = _.uniq(_.map(files, (file) => {
-    return file.replace(/^pages/, '').replace(/\.vue$/, '').replace('/index', '').replace('_', ':').replace('', '/').replace(/\/{2,}/g, '/')
+    return file.replace(/^pages/, '').replace(/\.vue$/, '').replace(/\/index/g, '').replace(/_/g, ':').replace('', '/').replace(/\/{2,}/g, '/')
   }))
   /*
   ** Interpret and move template files to .nuxt/
diff --git a/lib/generate.js b/lib/generate.js
index fddef50686..9632636ab2 100644
--- a/lib/generate.js
+++ b/lib/generate.js
@@ -69,15 +69,15 @@ module.exports = function () {
     */
     let routes = []
     this.routes.forEach((route) => {
-      if (route.path.includes(':') || route.path.includes('*')) {
-        const routeParams = this.options.generate.routeParams[route.path]
+      if (route.includes(':') || route.includes('*')) {
+        const routeParams = this.options.generate.routeParams[route]
         if (!routeParams) {
-          console.error(`Could not generate the dynamic route ${route.path}, please add the mapping params in nuxt.config.js (generate.routeParams).`) // eslint-disable-line no-console
+          console.error(`Could not generate the dynamic route ${route}, please add the mapping params in nuxt.config.js (generate.routeParams).`) // eslint-disable-line no-console
           return process.exit(1)
         }
-        const toPath = pathToRegexp.compile(route.path)
+        const toPath = pathToRegexp.compile(route)
         routes = routes.concat(routeParams.map((params) => {
-          return Object.assign({}, route, { path: toPath(params) })
+          return toPath(params)
         }))
       } else {
         routes.push(route)
@@ -87,8 +87,8 @@ module.exports = function () {
       while (routes.length) {
         yield routes.splice(0, 500).map((route) => {
           return co(function * () {
-            const { html } = yield self.renderRoute(route.path)
-            var path = join(route.path, sep, 'index.html') // /about -> /about/index.html
+            const { html } = yield self.renderRoute(route)
+            var path = join(route, sep, 'index.html') // /about -> /about/index.html
             debug('Generate file: ' + path)
             path = join(distPath, path)
             // Make sure the sub folders are created

From 7f3a39fea1d7571dbd0a617e42bc9c43734e2038 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Mon, 12 Dec 2016 21:12:44 +0100
Subject: [PATCH 15/42] Fix child components data

---
 examples/custom-routes/pages/users/_id.vue |  8 --------
 lib/app/client.js                          | 10 ++++++----
 2 files changed, 6 insertions(+), 12 deletions(-)

diff --git a/examples/custom-routes/pages/users/_id.vue b/examples/custom-routes/pages/users/_id.vue
index 63b5d6c73a..7151655af8 100644
--- a/examples/custom-routes/pages/users/_id.vue
+++ b/examples/custom-routes/pages/users/_id.vue
@@ -18,14 +18,6 @@ export default {
     .catch(() => {
       error({ message: 'User not found', statusCode: 404 })
     })
-  },
-  watch: {
-    $route () {
-      return axios.get(`https://jsonplaceholder.typicode.com/users/${this.$route.params.id}`)
-      .then((res) => {
-        this.user = res.data
-      })
-    }
   }
 }
 </script>
diff --git a/lib/app/client.js b/lib/app/client.js
index a9a2c2cf2a..01e755d2f9 100644
--- a/lib/app/client.js
+++ b/lib/app/client.js
@@ -130,12 +130,14 @@ function fixPrepatch (to, ___) {
     return
   }
   Vue.nextTick(() => {
-    let RouterViewComponentFile = this.$nuxt._routerViewCache.default.__file
-    if (typeof this.$nuxt._routerViewCache.default === 'function') RouterViewComponentFile = this.$nuxt._routerViewCache.default.options.__file
     let instances = getMatchedComponentsInstances(to)
-    instances.forEach((instance, i) => {
+    instances.forEach((instance) => {
       if (!instance) return;
-      if (instance.constructor.options.__file === RouterViewComponentFile) {
+      let file = instance.$parent._routerViewCache.default.__file
+      if (typeof instance.$parent._routerViewCache.default === 'function') {
+        file = instance.$parent._routerViewCache.default.options.__file
+      }
+      if (instance.constructor.options.__file === file) {
         let newData = instance.constructor.options.data()
         for (let key in newData) {
           Vue.set(instance.$data, key, newData[key])

From 4ebe6f7ac8b3fac95e84920e4f61ca1b9463ba3b Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Mon, 12 Dec 2016 23:09:08 +0100
Subject: [PATCH 16/42] add html minifier for generate

---
 lib/generate.js | 6 +++++-
 package.json    | 1 +
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/lib/generate.js b/lib/generate.js
index 9632636ab2..133df7afe4 100644
--- a/lib/generate.js
+++ b/lib/generate.js
@@ -8,6 +8,7 @@ const pathToRegexp = require('path-to-regexp')
 const _ = require('lodash')
 const { resolve, join, dirname, sep } = require('path')
 const { promisifyRouteParams } = require('./utils')
+const { minify } = require('html-minifier')
 const copy = pify(fs.copy)
 const remove = pify(fs.remove)
 const writeFile = pify(fs.writeFile)
@@ -87,7 +88,10 @@ module.exports = function () {
       while (routes.length) {
         yield routes.splice(0, 500).map((route) => {
           return co(function * () {
-            const { html } = yield self.renderRoute(route)
+            var { html } = yield self.renderRoute(route)
+            html = minify(html, {
+              collapseWhitespace: true
+            })
             var path = join(route, sep, 'index.html') // /about -> /about/index.html
             debug('Generate file: ' + path)
             path = join(distPath, path)
diff --git a/package.json b/package.json
index e853cbc229..85f494caf2 100644
--- a/package.json
+++ b/package.json
@@ -63,6 +63,7 @@
     "fs-extra": "^1.0.0",
     "glob": "^7.1.1",
     "hash-sum": "^1.0.2",
+    "html-minifier": "^3.2.3",
     "lodash": "^4.17.2",
     "lru-cache": "^4.0.2",
     "memory-fs": "^0.4.1",

From 0df05fd633a0f05b820ff05745a7324c28bce613 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Mon, 12 Dec 2016 23:15:54 +0100
Subject: [PATCH 17/42] html-minifier config

---
 lib/generate.js | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

diff --git a/lib/generate.js b/lib/generate.js
index 133df7afe4..5e3703fdb3 100644
--- a/lib/generate.js
+++ b/lib/generate.js
@@ -90,7 +90,24 @@ module.exports = function () {
           return co(function * () {
             var { html } = yield self.renderRoute(route)
             html = minify(html, {
-              collapseWhitespace: true
+              collapseBooleanAttributes: true,
+              collapseWhitespace: true,
+              decodeEntities: true,
+              minifyCSS: true,
+              minifyJS: true,
+              processConditionalComments: true,
+              removeAttributeQuotes: true,
+              removeComments: true,
+              removeEmptyAttributes: true,
+              removeOptionalTags: true,
+              removeRedundantAttributes: true,
+              removeScriptTypeAttributes: true,
+              removeStyleLinkTypeAttributes: true,
+              removeTagWhitespace: true,
+              sortAttributes: true,
+              sortClassName: true,
+              trimCustomFragments: true,
+              useShortDoctype: true
             })
             var path = join(route, sep, 'index.html') // /about -> /about/index.html
             debug('Generate file: ' + path)

From 1916bb6d2f46eaacdc8a82243bc92a0b444e0c50 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Tue, 13 Dec 2016 11:04:48 +0100
Subject: [PATCH 18/42] clean example

---
 examples/custom-routes/layouts/app.vue      |  8 +++-----
 examples/custom-routes/nuxt.config.js       |  6 +++---
 examples/custom-routes/pages/author.vue     | 19 -------------------
 examples/custom-routes/pages/team/about.vue |  5 +++++
 examples/custom-routes/pages/team/index.vue |  5 +++++
 5 files changed, 16 insertions(+), 27 deletions(-)
 delete mode 100644 examples/custom-routes/pages/author.vue
 create mode 100644 examples/custom-routes/pages/team/about.vue
 create mode 100644 examples/custom-routes/pages/team/index.vue

diff --git a/examples/custom-routes/layouts/app.vue b/examples/custom-routes/layouts/app.vue
index 7bf1554099..9e10a17096 100644
--- a/examples/custom-routes/layouts/app.vue
+++ b/examples/custom-routes/layouts/app.vue
@@ -2,19 +2,17 @@
   <nuxt-container>
     <nav class="Navbar clearfix">
       <h1 class="Navbar__Title">
-        <router-link to="/" class="Navbar__Links__Item__Link">
-          Nuxt Custom Routes
-        </router-link>
+        Nuxt Custom Routes
       </h1>
       <ul class="Navbar__Links">
         <li class="Navbar__Links__Item">
-          <router-link to="/author" class="Navbar__Links__Item__Link">
+          <router-link to="/team" class="Navbar__Links__Item__Link">
             Basic route
           </router-link>
         </li>
         <li class="Navbar__Links__Item">
           <router-link to="/projects" class="Navbar__Links__Item__Link">
-            Dynamic route
+            Dynamic routes
           </router-link>
         </li>
         <li class="Navbar__Links__Item">
diff --git a/examples/custom-routes/nuxt.config.js b/examples/custom-routes/nuxt.config.js
index 3ca5309ed5..5fa4376b1e 100644
--- a/examples/custom-routes/nuxt.config.js
+++ b/examples/custom-routes/nuxt.config.js
@@ -5,9 +5,9 @@ module.exports = {
   generate: {
     routeParams: {
       '/users/:id': [{id: 1}, {id: 2}, {id: 3}, {id: 4}, {id: 5}],
-      '/posts/:slug': [{slug: 'welcome'}, {slug: 'foo'}, {slug: 'bar'}],
-      '/posts/:slug/comments': [{slug: 'welcome'}, {slug: 'foo'}, {slug: 'bar'}],
-      '/posts/:slug/:name': [{slug: 'welcome', name: 'a'}, {slug: 'foo', name: 'b'}, {slug: 'bar', name: 'a'}],
+      '/posts/:slug': [{slug: 'foo'}, {slug: 'bar'}],
+      '/posts/:slug/comments': [{slug: 'foo'}, {slug: 'bar'}],
+      '/posts/:slug/:name': [{slug: 'foo', name: 'b'}, {slug: 'bar', name: 'a'}],
       '/projects/:slug': [{slug: 'toto'}, {slug: 'titi'}, {slug: 'tutu'}]
     }
   }
diff --git a/examples/custom-routes/pages/author.vue b/examples/custom-routes/pages/author.vue
deleted file mode 100644
index d4a341e5a7..0000000000
--- a/examples/custom-routes/pages/author.vue
+++ /dev/null
@@ -1,19 +0,0 @@
-<template>
-  <div class="container">
-    <h1>Basic route with Alias</h1>
-    <router-link to="/nuxt" class="Navbar__Links__Item__Link" v-if="$route.path === '/author'">
-      This route is also available on /nuxt
-    </router-link>
-    <router-link to="/author" class="Navbar__Links__Item__Link" v-else>
-      This route is also available on /author
-    </router-link>
-  </div>
-</template>
-
-<style scoped>
-.container
-{
-  text-align: center;
-  padding-bottom: 30px;
-}
-</style>
diff --git a/examples/custom-routes/pages/team/about.vue b/examples/custom-routes/pages/team/about.vue
new file mode 100644
index 0000000000..a7dcb785bc
--- /dev/null
+++ b/examples/custom-routes/pages/team/about.vue
@@ -0,0 +1,5 @@
+<template>
+  <div class="container">
+    <h1>About</h1>
+  </div>
+</template>
diff --git a/examples/custom-routes/pages/team/index.vue b/examples/custom-routes/pages/team/index.vue
new file mode 100644
index 0000000000..044fe61ee2
--- /dev/null
+++ b/examples/custom-routes/pages/team/index.vue
@@ -0,0 +1,5 @@
+<template>
+  <div class="container">
+    <h1>Team</h1>
+  </div>
+</template>

From e1b5846899ec02a026df7e83806a42eb0a030faf Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Tue, 13 Dec 2016 11:04:55 +0100
Subject: [PATCH 19/42] update readme

---
 examples/custom-routes/README.md | 182 +++++++++++++++++++++++++++----
 1 file changed, 160 insertions(+), 22 deletions(-)

diff --git a/examples/custom-routes/README.md b/examples/custom-routes/README.md
index e9ce94212b..5c7007e30e 100644
--- a/examples/custom-routes/README.md
+++ b/examples/custom-routes/README.md
@@ -2,38 +2,176 @@
 
 > Nuxt.js is based on vue-router and allows you to defined custom routes :rocket:
 
-## Usage
+## Concept
+
+Nuxt.js detect and generate automatically the vue-router config according to your file tree of .vue files inside the `pages` directory.
+
+## Basic routes
+
+This file tree:
+
+```bash
+/pages
+|-> /team
+    |-> index.vue
+    |-> about.vue
+|-> index.vue
+```
+
+will automatically generate:
 
-Add your custom routes inside `nuxt.config.js`:
 ```js
-module.exports = {
-  router: {
-    routes: [
-      { name: 'user', path: '/users/:id', component: 'pages/user' }
-    ]
-  }
+router: {
+  routes: [
+    {
+      name: 'index',
+      path: '/',
+      component: 'pages/index'
+    },
+    {
+      name: 'team',
+      path: '/team',
+      component: 'pages/team/index'
+    },
+    {
+      name: 'team-about',
+      path: '/team/about',
+      component: 'pages/team/about'
+    }
+  ]
 }
 ```
 
-| key  | Optional? | definition |
-|------|------------|-----------|
-| `path` | **Required** | Route path, it can have dynamic mapping, look at [vue-router documentation](https://router.vuejs.org/en/essentials/dynamic-matching.html) about it. |
-| `component` | **Required** | Path to the `.vue` component, if relative, it has to be from the app folder. |
-| `name` | Optional | Route name, useful for linking to it with `<router-link>`, see [vue-router documentation](https://router.vuejs.org/en/essentials/named-routes.html) about it. |
-| `meta` | Optional | Let you add custom fields to get back inside your component (available in the context via `route.meta`  inside `data` and `fetch` methods). See [vue-router documentation](https://router.vuejs.org/en/advanced/meta.html) about it. |
-| `children` | Optional | *Not supported* |
+## Dynamic routes
 
-## Hidden pages
+To define a dynamic route with a param, you need to define a .vue file prefixed by an underscore.
 
->If you want don't want nuxt.js to generate a route for a specific page, you just have to **rename it with _ at the beginning**.
+This file tree:
 
-Let's say I have a component `pages/user.vue` and I don't want nuxt.js to create the `/user`. I can rename it to `pages/_user.vue` and voilà!
+```bash
+/pages
+|-> /projects
+    |-> index.vue
+    |-> _slug.vue
+```
+
+will automatically generate:
 
-You can then change the component path in the `nuxt.config.js`:
 ```js
-// ...
-  { name: 'user', path: '/users/:id', component: 'pages/_user' }
-// ...
+router: {
+  routes: [
+    {
+      name: 'projects',
+      path: '/projects',
+      component: 'pages/projects/index'
+    },
+    {
+      name: 'projects-slug',
+      path: '/projects/:slug',
+      component: 'pages/projects/_slug'
+    }
+  ]
+}
+```
+
+### Additional feature : validate (optional)
+
+Nuxt.js allows you to define a validator function inside your dynamic route component (In this example: `pages/projects/_slug.vue`).
+If validate function fails, Nuxt.js will automatically load the 404 error page.
+
+```js
+<script>
+export default {
+  validate ({ params }) {
+    return /^[A-z]+$/.test(params.slug)
+  }
+}
+</script>
+```
+
+## Nested Routes (children)
+
+To define a nested route, you need to define a .vue file with the same name as the directory wich contain your children views.
+> Don't forget to put <router-view></router-view> inside your parent .vue file.
+
+This file tree:
+
+```bash
+/pages
+|-> /users
+    |-> _id.vue
+|-> users.vue
+```
+
+will automatically generate:
+
+```js
+router: {
+  routes: [
+    {
+			path: '/users',
+			component: 'pages/users',
+			children: [
+				{
+					path: ':id',
+					component: 'pages/users/_id',
+					name: 'users-id'
+				}
+			]
+		}
+  ]
+}
+```
+
+## Dynamic Nested Routes
+
+This file tree:
+
+```bash
+/pages
+|-> /posts
+    |-> /_slug
+        |-> _name.vue
+        |-> _comments.vue
+    |-> _slug.vue
+    |-> index.vue
+|-> posts.vue
+```
+
+will automatically generate:
+
+```js
+router: {
+  routes: [
+    {
+			path: '/posts',
+      component: 'pages/posts',
+			children: [
+				{
+					path: "",
+					component: 'pages/posts/index',
+					name: 'posts'
+				},
+				{
+					path: ':slug',
+					component: 'pages/posts/_slug',
+					children: [
+						{
+							path: 'comments',
+							component: 'pages/posts/_slug/comments',
+							name: 'posts-slug-comments'
+						},
+						{
+							path: ':name',
+							component: 'pages/posts/_slug/_name',
+							name: 'posts-slug-name'
+						}
+					]
+				}
+			]
+		}
+  ]
+}
 ```
 
 ## Demo

From 044a4bfb558e19ec209b8236c9d837cb9f40e7eb Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Tue, 13 Dec 2016 11:06:11 +0100
Subject: [PATCH 20/42] update readme

---
 examples/custom-routes/README.md | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/examples/custom-routes/README.md b/examples/custom-routes/README.md
index 5c7007e30e..df987939f7 100644
--- a/examples/custom-routes/README.md
+++ b/examples/custom-routes/README.md
@@ -77,6 +77,7 @@ router: {
 ### Additional feature : validate (optional)
 
 Nuxt.js allows you to define a validator function inside your dynamic route component (In this example: `pages/projects/_slug.vue`).
+
 If validate function fails, Nuxt.js will automatically load the 404 error page.
 
 ```js
@@ -92,7 +93,7 @@ export default {
 ## Nested Routes (children)
 
 To define a nested route, you need to define a .vue file with the same name as the directory wich contain your children views.
-> Don't forget to put <router-view></router-view> inside your parent .vue file.
+> Don't forget to put `<router-view></router-view>` inside your parent .vue file.
 
 This file tree:
 

From 14543bc3273ace093e7b64df5d0f0b663c48c072 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Tue, 13 Dec 2016 11:08:23 +0100
Subject: [PATCH 21/42] fix tabs readme

---
 examples/custom-routes/README.md | 70 ++++++++++++++++----------------
 1 file changed, 35 insertions(+), 35 deletions(-)

diff --git a/examples/custom-routes/README.md b/examples/custom-routes/README.md
index df987939f7..4a8fb37110 100644
--- a/examples/custom-routes/README.md
+++ b/examples/custom-routes/README.md
@@ -110,16 +110,16 @@ will automatically generate:
 router: {
   routes: [
     {
-			path: '/users',
-			component: 'pages/users',
-			children: [
-				{
-					path: ':id',
-					component: 'pages/users/_id',
-					name: 'users-id'
-				}
-			]
-		}
+      path: '/users',
+      component: 'pages/users',
+      children: [
+        {
+          path: ':id',
+          component: 'pages/users/_id',
+          name: 'users-id'
+        }
+      ]
+    }
   ]
 }
 ```
@@ -145,32 +145,32 @@ will automatically generate:
 router: {
   routes: [
     {
-			path: '/posts',
+      path: '/posts',
       component: 'pages/posts',
-			children: [
-				{
-					path: "",
-					component: 'pages/posts/index',
-					name: 'posts'
-				},
-				{
-					path: ':slug',
-					component: 'pages/posts/_slug',
-					children: [
-						{
-							path: 'comments',
-							component: 'pages/posts/_slug/comments',
-							name: 'posts-slug-comments'
-						},
-						{
-							path: ':name',
-							component: 'pages/posts/_slug/_name',
-							name: 'posts-slug-name'
-						}
-					]
-				}
-			]
-		}
+      children: [
+        {
+          path: "",
+          component: 'pages/posts/index',
+          name: 'posts'
+        },
+        {
+          path: ':slug',
+          component: 'pages/posts/_slug',
+          children: [
+            {
+              path: 'comments',
+              component: 'pages/posts/_slug/comments',
+              name: 'posts-slug-comments'
+            },
+            {
+              path: ':name',
+              component: 'pages/posts/_slug/_name',
+              name: 'posts-slug-name'
+            }
+          ]
+        }
+      ]
+    }
   ]
 }
 ```

From d3b904cb7c467e4ecbba0b86a28fb1511ec864ba Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Tue, 13 Dec 2016 11:17:05 +0100
Subject: [PATCH 22/42] fix readme

---
 examples/custom-routes/README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/examples/custom-routes/README.md b/examples/custom-routes/README.md
index 4a8fb37110..5751a2950d 100644
--- a/examples/custom-routes/README.md
+++ b/examples/custom-routes/README.md
@@ -133,7 +133,7 @@ This file tree:
 |-> /posts
     |-> /_slug
         |-> _name.vue
-        |-> _comments.vue
+        |-> comments.vue
     |-> _slug.vue
     |-> index.vue
 |-> posts.vue

From c16c7b71bdde15489fe28e4488e4408d616131e4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Tue, 13 Dec 2016 17:37:53 +0100
Subject: [PATCH 23/42] Fix babel options for .vue files

---
 lib/build/webpack/vue-loader.config.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/lib/build/webpack/vue-loader.config.js b/lib/build/webpack/vue-loader.config.js
index 4cfbf93fe1..9b2d85d5f6 100644
--- a/lib/build/webpack/vue-loader.config.js
+++ b/lib/build/webpack/vue-loader.config.js
@@ -1,10 +1,16 @@
 'use strict'
 
 module.exports = function () {
+  let babelOptions = JSON.stringify({
+    presets: [
+      ['es2015', { modules: false }],
+      'stage-2'
+    ]
+  })
   let config = {
     postcss: this.options.build.postcss,
     loaders: {
-      'js': 'babel-loader?presets[]=es2015&presets[]=stage-2',
+      'js': 'babel-loader?' + babelOptions,
       'less': 'vue-style-loader!css-loader!less-loader',
       'sass': 'vue-style-loader!css-loader!sass-loader?indentedSyntax',
       'scss': 'vue-style-loader!css-loader!sass-loader',

From 1c4e7678507354bdd7742c0c33c7497a3a11971f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Tue, 13 Dec 2016 17:39:59 +0100
Subject: [PATCH 24/42] Add babel options in .vue files

---
 lib/build/webpack/vue-loader.config.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/lib/build/webpack/vue-loader.config.js b/lib/build/webpack/vue-loader.config.js
index 9b2d85d5f6..7b0f4d1217 100644
--- a/lib/build/webpack/vue-loader.config.js
+++ b/lib/build/webpack/vue-loader.config.js
@@ -1,12 +1,14 @@
 'use strict'
 
+const { defaults } = require('lodash')
+
 module.exports = function () {
-  let babelOptions = JSON.stringify({
+  let babelOptions = JSON.stringify(defaults(this.options.build.babel, {
     presets: [
       ['es2015', { modules: false }],
       'stage-2'
     ]
-  })
+  }))
   let config = {
     postcss: this.options.build.postcss,
     loaders: {

From b6b1fc3073a7b03713d40d65eba1d8d9aed2bf87 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Tue, 13 Dec 2016 17:42:41 +0100
Subject: [PATCH 25/42] add component nuxt-child

---
 examples/custom-routes/pages/posts.vue |  2 +-
 lib/app/components/nuxt-child.vue      | 38 ++++++++++++++++++++++++++
 lib/app/index.js                       |  3 ++
 lib/build/index.js                     |  1 +
 4 files changed, 43 insertions(+), 1 deletion(-)
 create mode 100644 lib/app/components/nuxt-child.vue

diff --git a/examples/custom-routes/pages/posts.vue b/examples/custom-routes/pages/posts.vue
index 946ca2731f..2740c339b0 100644
--- a/examples/custom-routes/pages/posts.vue
+++ b/examples/custom-routes/pages/posts.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="container">
     <h1>Dynamic nested route example</h1>
-    <router-view></router-view>
+    <nuxt-child></nuxt-child>
   </div>
 </template>
diff --git a/lib/app/components/nuxt-child.vue b/lib/app/components/nuxt-child.vue
new file mode 100644
index 0000000000..8e09629e46
--- /dev/null
+++ b/lib/app/components/nuxt-child.vue
@@ -0,0 +1,38 @@
+<template>
+  <transition :name="transition.name" :mode="transition.mode">
+    <router-view></router-view>
+  </transition>
+</template>
+
+<script>
+export default {
+  name: 'nuxt-child',
+  props: {
+    transition: {
+      type: Object,
+      default: () => {
+        return {
+          mode: 'out-in', // out-in ou in-out
+          name: 'fade',
+          type: '', // animation ou transition
+          enter: null, // isFunc = js, is String = css
+          enterActive: '',
+          beforeEnter: null, // Func
+          afterEnter: null,
+          enterCancelled: null,
+          leave: null, // isFunc = js, is String = css
+          leaveActive: '',
+          beforeLeave: null, // Func
+          afterLeave: null,
+          leaveCancelled: null,
+          appear: null, // isFunc = js, is String = css
+          appearClass: '',
+          appearActiveClass: '',
+          beforeAppear: null,
+          afterAppear: null
+        }
+      }
+    }
+  }
+}
+</script>
diff --git a/lib/app/index.js b/lib/app/index.js
index 86daac5d69..91fcf7f98c 100644
--- a/lib/app/index.js
+++ b/lib/app/index.js
@@ -5,11 +5,14 @@ import Meta from 'vue-meta'
 import router from './router.js'
 <% if (store) { %>import store from '~store/index.js'<% } %>
 import NuxtContainer from './components/nuxt-container.vue'
+import NuxtChild from './components/nuxt-child.vue'
 import Nuxt from './components/nuxt.vue'
 import App from '<%= appPath %>'
 
 // Component: <nuxt-container>
 Vue.component(NuxtContainer.name, NuxtContainer)
+// Component: <nuxt-child>
+Vue.component(NuxtChild.name, NuxtChild)
 // Component: <nuxt>
 Vue.component(Nuxt.name, Nuxt)
 
diff --git a/lib/build/index.js b/lib/build/index.js
index 8fd05707de..70f41a74a8 100644
--- a/lib/build/index.js
+++ b/lib/build/index.js
@@ -150,6 +150,7 @@ function * generateRoutesAndFiles () {
     'router.js',
     'server.js',
     'utils.js',
+    'components/nuxt-child.vue',
     'components/nuxt-container.vue',
     'components/nuxt.vue',
     'components/nuxt-loading.vue'

From b245b8d6ff5ff5247ccc1fe1ee9e68ed35843c20 Mon Sep 17 00:00:00 2001
From: Alexandre Chopin <wikeo65@gmail.com>
Date: Tue, 13 Dec 2016 19:00:21 +0100
Subject: [PATCH 26/42] update nuxt-child props

---
 lib/app/components/nuxt-child.vue | 20 +++++++++-----------
 1 file changed, 9 insertions(+), 11 deletions(-)

diff --git a/lib/app/components/nuxt-child.vue b/lib/app/components/nuxt-child.vue
index 8e09629e46..b1c57a6cea 100644
--- a/lib/app/components/nuxt-child.vue
+++ b/lib/app/components/nuxt-child.vue
@@ -12,24 +12,22 @@ export default {
       type: Object,
       default: () => {
         return {
+          hooks: false,
           mode: 'out-in', // out-in ou in-out
           name: 'fade',
           type: '', // animation ou transition
-          enter: null, // isFunc = js, is String = css
-          enterActive: '',
+          enterClass: '',
+          enterActiveClass: '',
+          leaveClass: '',
+          leaveActiveClass: '',
           beforeEnter: null, // Func
+          enter: null,
           afterEnter: null,
           enterCancelled: null,
-          leave: null, // isFunc = js, is String = css
-          leaveActive: '',
-          beforeLeave: null, // Func
+          beforeLeave: null,
+          leave: null,
           afterLeave: null,
-          leaveCancelled: null,
-          appear: null, // isFunc = js, is String = css
-          appearClass: '',
-          appearActiveClass: '',
-          beforeAppear: null,
-          afterAppear: null
+          leaveCancelled: null
         }
       }
     }

From 0dd867cdec8806c2e76161fd824609ada563a7bf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Wed, 14 Dec 2016 15:30:44 +0100
Subject: [PATCH 27/42] Fix rebuild when nuxt.config.js changed

---
 bin/nuxt-dev | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/bin/nuxt-dev b/bin/nuxt-dev
index faa4f6712f..de6b5af1dd 100755
--- a/bin/nuxt-dev
+++ b/bin/nuxt-dev
@@ -37,7 +37,7 @@ nuxt.build()
 function listenOnConfigChanges (nuxt, server) {
   // Listen on nuxt.config.js changes
   var build = _.debounce(() => {
-    debug('[nuxt.config.js] changed, rebuilding the app...')
+    debug('[nuxt.config.js] changed')
     delete require.cache[nuxtConfigFile]
     var options = {}
     if (fs.existsSync(nuxtConfigFile)) {
@@ -50,6 +50,8 @@ function listenOnConfigChanges (nuxt, server) {
     options.rootDir = rootDir
     nuxt.close()
     .then(() => {
+      nuxt.renderer = null
+      debug('Rebuilding the app...')
       return new Nuxt(options).build()
     })
     .then((nuxt) => {

From 970ac4cad88c70ef0371b3f8f75e88000f7785b1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Thu, 15 Dec 2016 18:47:20 +0100
Subject: [PATCH 28/42] Add editorconfig

---
 .editorconfig | 13 +++++++++++++
 1 file changed, 13 insertions(+)
 create mode 100644 .editorconfig

diff --git a/.editorconfig b/.editorconfig
new file mode 100644
index 0000000000..9142239769
--- /dev/null
+++ b/.editorconfig
@@ -0,0 +1,13 @@
+# editorconfig.org
+root = true
+
+[*]
+indent_size = 2
+indent_style = space
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

From b8ec7329f7ec844cc7a55bc356f50b5eb652a605 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Thu, 15 Dec 2016 18:48:31 +0100
Subject: [PATCH 29/42] Set color for debug module

---
 bin/nuxt-dev       | 1 +
 lib/app/server.js  | 1 +
 lib/build/index.js | 1 +
 lib/render.js      | 1 +
 4 files changed, 4 insertions(+)

diff --git a/bin/nuxt-dev b/bin/nuxt-dev
index de6b5af1dd..a54b99f9ba 100755
--- a/bin/nuxt-dev
+++ b/bin/nuxt-dev
@@ -5,6 +5,7 @@ process.env.DEBUG = 'nuxt:*'
 
 var _ = require('lodash')
 var debug = require('debug')('nuxt:build')
+debug.color = 2 // force green color
 var fs = require('fs')
 var Nuxt = require('../')
 var chokidar = require('chokidar')
diff --git a/lib/app/server.js b/lib/app/server.js
index ea7e4a74e4..a5af32e6a1 100644
--- a/lib/app/server.js
+++ b/lib/app/server.js
@@ -1,6 +1,7 @@
 'use strict'
 
 const debug = require('debug')('nuxt:render')
+debug.color = 4 // force blue color
 import Vue from 'vue'
 import { stringify } from 'querystring'
 import { omit } from 'lodash'
diff --git a/lib/build/index.js b/lib/build/index.js
index 70f41a74a8..1b57fed562 100644
--- a/lib/build/index.js
+++ b/lib/build/index.js
@@ -1,6 +1,7 @@
 'use strict'
 
 const debug = require('debug')('nuxt:build')
+debug.color = 2 // force green color
 const _ = require('lodash')
 const co = require('co')
 const chokidar = require('chokidar')
diff --git a/lib/render.js b/lib/render.js
index f88fb77e76..c6850d6d81 100644
--- a/lib/render.js
+++ b/lib/render.js
@@ -1,4 +1,5 @@
 const debug = require('debug')('nuxt:render')
+debug.color = 4 // force blue color
 const co = require('co')
 const { urlJoin } = require('./utils')
 const { getContext } = require('./utils')

From 736f1ed1d5aa354e902eaedb96550b7f2a2a229b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Thu, 15 Dec 2016 18:53:00 +0100
Subject: [PATCH 30/42] Use webpack 2.2.0-rc.0

---
 lib/build/webpack/base.config.js | 3 +++
 package.json                     | 2 +-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/lib/build/webpack/base.config.js b/lib/build/webpack/base.config.js
index b92efeeff7..a48bef015e 100644
--- a/lib/build/webpack/base.config.js
+++ b/lib/build/webpack/base.config.js
@@ -23,6 +23,9 @@ module.exports = function () {
     output: {
       publicPath: urlJoin(this.options.router.base, '/_nuxt/')
     },
+    performance: {
+      hints: (this.dev ? false : 'warning')
+    },
     resolve: {
       extensions: ['.js', '.json', '.vue'],
       // Disable for now
diff --git a/package.json b/package.json
index 85f494caf2..a5bc1d728f 100644
--- a/package.json
+++ b/package.json
@@ -79,7 +79,7 @@
     "vue-server-renderer": "^2.1.3",
     "vue-template-compiler": "^2.1.3",
     "vuex": "^2.0.0",
-    "webpack": "2.1.0-beta.27",
+    "webpack": "2.2.0-rc.0",
     "webpack-dev-middleware": "^1.8.4",
     "webpack-hot-middleware": "^2.13.2"
   },

From 04ee77ce612c31950181c1847d5daa2d0e8b2250 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Thu, 15 Dec 2016 20:13:54 +0100
Subject: [PATCH 31/42] Fix webpack dependency

---
 examples/custom-routes/layouts/app.vue      |  7 +++++++
 examples/custom-routes/nuxt.config.js       |  3 ++-
 examples/custom-routes/pages/team/about.vue |  5 -----
 examples/custom-routes/pages/users.vue      | 18 ++++++++++++++++++
 package.json                                |  2 +-
 5 files changed, 28 insertions(+), 7 deletions(-)
 delete mode 100644 examples/custom-routes/pages/team/about.vue

diff --git a/examples/custom-routes/layouts/app.vue b/examples/custom-routes/layouts/app.vue
index 9e10a17096..51266bc962 100644
--- a/examples/custom-routes/layouts/app.vue
+++ b/examples/custom-routes/layouts/app.vue
@@ -95,4 +95,11 @@ a, a:hover
   text-decoration: none;
   color: #41B883;
 }
+
+.fade-enter-active, .fade-leave-active {
+  transition: opacity .3s;
+}
+.fade-enter, .fade-leave-active {
+  opacity: 0;
+}
 </style>
diff --git a/examples/custom-routes/nuxt.config.js b/examples/custom-routes/nuxt.config.js
index 5fa4376b1e..56133cacc2 100644
--- a/examples/custom-routes/nuxt.config.js
+++ b/examples/custom-routes/nuxt.config.js
@@ -10,5 +10,6 @@ module.exports = {
       '/posts/:slug/:name': [{slug: 'foo', name: 'b'}, {slug: 'bar', name: 'a'}],
       '/projects/:slug': [{slug: 'toto'}, {slug: 'titi'}, {slug: 'tutu'}]
     }
-  }
+  },
+  transition: 'fade'
 }
diff --git a/examples/custom-routes/pages/team/about.vue b/examples/custom-routes/pages/team/about.vue
deleted file mode 100644
index a7dcb785bc..0000000000
--- a/examples/custom-routes/pages/team/about.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template>
-  <div class="container">
-    <h1>About</h1>
-  </div>
-</template>
diff --git a/examples/custom-routes/pages/users.vue b/examples/custom-routes/pages/users.vue
index ce77a3dcbf..be67b73e0a 100644
--- a/examples/custom-routes/pages/users.vue
+++ b/examples/custom-routes/pages/users.vue
@@ -15,6 +15,7 @@
 import axios from 'axios'
 
 export default {
+  transition: 'bounce',
   data () {
     return axios.get('https://jsonplaceholder.typicode.com/users')
     .then((res) => {
@@ -45,4 +46,21 @@ export default {
 .router-link-active {
   color: #41b883 !important;
 }
+.bounce-enter-active {
+  animation: bounce-in .8s;
+}
+.bounce-leave-active {
+  animation: bounce-out .5s;
+}
+@keyframes bounce-in {
+  0% { transform: scale(0) }
+  50% { transform: scale(1.5) }
+  100% { transform: scale(1) }
+}
+@keyframes bounce-out {
+  0% { transform: scale(1) }
+  50% { transform: scale(1.5) }
+  100% { transform: scale(0) }
+}
+
 </style>
diff --git a/package.json b/package.json
index a5bc1d728f..89f8d42a6c 100644
--- a/package.json
+++ b/package.json
@@ -79,7 +79,7 @@
     "vue-server-renderer": "^2.1.3",
     "vue-template-compiler": "^2.1.3",
     "vuex": "^2.0.0",
-    "webpack": "2.2.0-rc.0",
+    "webpack": "2.2.0-rc",
     "webpack-dev-middleware": "^1.8.4",
     "webpack-hot-middleware": "^2.13.2"
   },

From 9d6db350798152947afdb360e4b6e63021a78010 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Thu, 15 Dec 2016 20:18:10 +0100
Subject: [PATCH 32/42] Fix webpack dependency

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 89f8d42a6c..a5bc1d728f 100644
--- a/package.json
+++ b/package.json
@@ -79,7 +79,7 @@
     "vue-server-renderer": "^2.1.3",
     "vue-template-compiler": "^2.1.3",
     "vuex": "^2.0.0",
-    "webpack": "2.2.0-rc",
+    "webpack": "2.2.0-rc.0",
     "webpack-dev-middleware": "^1.8.4",
     "webpack-hot-middleware": "^2.13.2"
   },

From 649365f4f61f79e83b2ff6759ee7f070fe1d5260 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Fri, 16 Dec 2016 10:09:51 +0100
Subject: [PATCH 33/42] Force npm3

---
 .travis.yml | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/.travis.yml b/.travis.yml
index 73ae23b0f5..07ba1ee4b9 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -4,6 +4,8 @@ node_js:
   - "6.9"
   - "5.12"
   - "4.7"
+before_install:
+  - if [[ `npm -v` != 3* ]]; then npm i -g npm@3; fi
 install:
   - npm install
   - npm run build

From 213ee890a74a24ed521c7ae96bea9c03beb84311 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Fri, 16 Dec 2016 17:45:05 +0100
Subject: [PATCH 34/42] Add utils.compile

---
 lib/app/utils.js | 232 +++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 232 insertions(+)

diff --git a/lib/app/utils.js b/lib/app/utils.js
index b2b9979a9a..a06d68f393 100644
--- a/lib/app/utils.js
+++ b/lib/app/utils.js
@@ -91,3 +91,235 @@ export function getLocation (base) {
 export function urlJoin () {
   return [].slice.call(arguments).join('/').replace(/\/+/g, '/')
 }
+
+// Imported from path-to-regexp
+
+/**
+ * Compile a string to a template function for the path.
+ *
+ * @param  {string}             str
+ * @param  {Object=}            options
+ * @return {!function(Object=, Object=)}
+ */
+export function compile (str, options) {
+  return tokensToFunction(parse(str, options))
+}
+
+/**
+ * The main path matching regexp utility.
+ *
+ * @type {RegExp}
+ */
+const PATH_REGEXP = new RegExp([
+  // Match escaped characters that would otherwise appear in future matches.
+  // This allows the user to escape special characters that won't transform.
+  '(\\\\.)',
+  // Match Express-style parameters and un-named parameters with a prefix
+  // and optional suffixes. Matches appear as:
+  //
+  // "/:test(\\d+)?" => ["/", "test", "\d+", undefined, "?", undefined]
+  // "/route(\\d+)"  => [undefined, undefined, undefined, "\d+", undefined, undefined]
+  // "/*"            => ["/", undefined, undefined, undefined, undefined, "*"]
+  '([\\/.])?(?:(?:\\:(\\w+)(?:\\(((?:\\\\.|[^\\\\()])+)\\))?|\\(((?:\\\\.|[^\\\\()])+)\\))([+*?])?|(\\*))'
+].join('|'), 'g')
+
+/**
+ * Parse a string for the raw tokens.
+ *
+ * @param  {string}  str
+ * @param  {Object=} options
+ * @return {!Array}
+ */
+function parse (str, options) {
+  var tokens = []
+  var key = 0
+  var index = 0
+  var path = ''
+  var defaultDelimiter = options && options.delimiter || '/'
+  var res
+
+  while ((res = PATH_REGEXP.exec(str)) != null) {
+    var m = res[0]
+    var escaped = res[1]
+    var offset = res.index
+    path += str.slice(index, offset)
+    index = offset + m.length
+
+    // Ignore already escaped sequences.
+    if (escaped) {
+      path += escaped[1]
+      continue
+    }
+
+    var next = str[index]
+    var prefix = res[2]
+    var name = res[3]
+    var capture = res[4]
+    var group = res[5]
+    var modifier = res[6]
+    var asterisk = res[7]
+
+    // Push the current path onto the tokens.
+    if (path) {
+      tokens.push(path)
+      path = ''
+    }
+
+    var partial = prefix != null && next != null && next !== prefix
+    var repeat = modifier === '+' || modifier === '*'
+    var optional = modifier === '?' || modifier === '*'
+    var delimiter = res[2] || defaultDelimiter
+    var pattern = capture || group
+
+    tokens.push({
+      name: name || key++,
+      prefix: prefix || '',
+      delimiter: delimiter,
+      optional: optional,
+      repeat: repeat,
+      partial: partial,
+      asterisk: !!asterisk,
+      pattern: pattern ? escapeGroup(pattern) : (asterisk ? '.*' : '[^' + escapeString(delimiter) + ']+?')
+    })
+  }
+
+  // Match any characters still remaining.
+  if (index < str.length) {
+    path += str.substr(index)
+  }
+
+  // If the path exists, push it onto the end.
+  if (path) {
+    tokens.push(path)
+  }
+
+  return tokens
+}
+
+/**
+ * Prettier encoding of URI path segments.
+ *
+ * @param  {string}
+ * @return {string}
+ */
+function encodeURIComponentPretty (str) {
+  return encodeURI(str).replace(/[\/?#]/g, function (c) {
+    return '%' + c.charCodeAt(0).toString(16).toUpperCase()
+  })
+}
+
+/**
+ * Encode the asterisk parameter. Similar to `pretty`, but allows slashes.
+ *
+ * @param  {string}
+ * @return {string}
+ */
+function encodeAsterisk (str) {
+  return encodeURI(str).replace(/[?#]/g, function (c) {
+    return '%' + c.charCodeAt(0).toString(16).toUpperCase()
+  })
+}
+
+/**
+ * Expose a method for transforming tokens into the path function.
+ */
+function tokensToFunction (tokens) {
+  // Compile all the tokens into regexps.
+  var matches = new Array(tokens.length)
+
+  // Compile all the patterns before compilation.
+  for (var i = 0; i < tokens.length; i++) {
+    if (typeof tokens[i] === 'object') {
+      matches[i] = new RegExp('^(?:' + tokens[i].pattern + ')$')
+    }
+  }
+
+  return function (obj, opts) {
+    var path = ''
+    var data = obj || {}
+    var options = opts || {}
+    var encode = options.pretty ? encodeURIComponentPretty : encodeURIComponent
+
+    for (var i = 0; i < tokens.length; i++) {
+      var token = tokens[i]
+
+      if (typeof token === 'string') {
+        path += token
+
+        continue
+      }
+
+      var value = data[token.name]
+      var segment
+
+      if (value == null) {
+        if (token.optional) {
+          // Prepend partial segment prefixes.
+          if (token.partial) {
+            path += token.prefix
+          }
+
+          continue
+        } else {
+          throw new TypeError('Expected "' + token.name + '" to be defined')
+        }
+      }
+
+      if (Array.isArray(value)) {
+        if (!token.repeat) {
+          throw new TypeError('Expected "' + token.name + '" to not repeat, but received `' + JSON.stringify(value) + '`')
+        }
+
+        if (value.length === 0) {
+          if (token.optional) {
+            continue
+          } else {
+            throw new TypeError('Expected "' + token.name + '" to not be empty')
+          }
+        }
+
+        for (var j = 0; j < value.length; j++) {
+          segment = encode(value[j])
+
+          if (!matches[i].test(segment)) {
+            throw new TypeError('Expected all "' + token.name + '" to match "' + token.pattern + '", but received `' + JSON.stringify(segment) + '`')
+          }
+
+          path += (j === 0 ? token.prefix : token.delimiter) + segment
+        }
+
+        continue
+      }
+
+      segment = token.asterisk ? encodeAsterisk(value) : encode(value)
+
+      if (!matches[i].test(segment)) {
+        throw new TypeError('Expected "' + token.name + '" to match "' + token.pattern + '", but received "' + segment + '"')
+      }
+
+      path += token.prefix + segment
+    }
+
+    return path
+  }
+}
+
+/**
+ * Escape a regular expression string.
+ *
+ * @param  {string} str
+ * @return {string}
+ */
+function escapeString (str) {
+  return str.replace(/([.+*?=^!:${}()[\]|\/\\])/g, '\\$1')
+}
+
+/**
+ * Escape the capturing group by escaping special characters and meaning.
+ *
+ * @param  {string} group
+ * @return {string}
+ */
+function escapeGroup (group) {
+  return group.replace(/([=!:$\/()])/g, '\\$1')
+}

From 2cf68b6019f594dfadec77ac7de50d7d534143a9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Fri, 16 Dec 2016 17:45:47 +0100
Subject: [PATCH 35/42] add nuxt-child and nuxt-link

---
 lib/app/components/nuxt-child.js  | 60 +++++++++++++++++++++++++++++++
 lib/app/components/nuxt-child.vue | 36 -------------------
 lib/app/components/nuxt-link.js   |  9 +++++
 lib/app/components/nuxt.vue       |  8 ++---
 lib/app/index.js                  | 31 ++++++++++------
 lib/build/index.js                |  7 ++--
 6 files changed, 98 insertions(+), 53 deletions(-)
 create mode 100644 lib/app/components/nuxt-child.js
 delete mode 100644 lib/app/components/nuxt-child.vue
 create mode 100644 lib/app/components/nuxt-link.js

diff --git a/lib/app/components/nuxt-child.js b/lib/app/components/nuxt-child.js
new file mode 100644
index 0000000000..4f78cc2ebb
--- /dev/null
+++ b/lib/app/components/nuxt-child.js
@@ -0,0 +1,60 @@
+import Vue from 'vue'
+
+const transitionsKeys = [
+  'name',
+  'mode',
+  'css',
+  'type',
+  'enterClass',
+  'leaveClass',
+  'enterActiveClass',
+  'leaveActiveClass'
+]
+const listenersKeys = [
+  'beforeEnter',
+  'enter',
+  'afterEnter',
+  'enterCancelled',
+  'beforeLeave',
+  'leave',
+  'afterLeave',
+  'leaveCancelled'
+]
+
+export default {
+  name: 'nuxt-child',
+  functional: true,
+  render (h, { parent, data }) {
+    data.nuxtChild = true
+
+    const transitions = parent.$nuxt.nuxt.transitions
+    const defaultTransition = parent.$nuxt.nuxt.defaultTransition
+    let depth = 0
+    while (parent) {
+      if (parent.$vnode && parent.$vnode.data.nuxtChild) {
+        depth++
+      }
+      parent = parent.$parent
+    }
+    data.nuxtChildDepth = depth
+    const transition = transitions[depth] || defaultTransition
+    let transitionProps = {}
+    transitionsKeys.forEach((key) => {
+      if (typeof transition[key] !== 'undefined') {
+        transitionProps[key] = transition[key]
+      }
+    })
+    let listeners = {}
+    listenersKeys.forEach((key) => {
+      if (typeof transition[key] === 'function') {
+        listeners[key] = transition[key]
+      }
+    })
+    return h('transition', {
+      props: transitionProps,
+      on: listeners
+    }, [
+      h('router-view', data)
+    ])
+  }
+}
diff --git a/lib/app/components/nuxt-child.vue b/lib/app/components/nuxt-child.vue
deleted file mode 100644
index b1c57a6cea..0000000000
--- a/lib/app/components/nuxt-child.vue
+++ /dev/null
@@ -1,36 +0,0 @@
-<template>
-  <transition :name="transition.name" :mode="transition.mode">
-    <router-view></router-view>
-  </transition>
-</template>
-
-<script>
-export default {
-  name: 'nuxt-child',
-  props: {
-    transition: {
-      type: Object,
-      default: () => {
-        return {
-          hooks: false,
-          mode: 'out-in', // out-in ou in-out
-          name: 'fade',
-          type: '', // animation ou transition
-          enterClass: '',
-          enterActiveClass: '',
-          leaveClass: '',
-          leaveActiveClass: '',
-          beforeEnter: null, // Func
-          enter: null,
-          afterEnter: null,
-          enterCancelled: null,
-          beforeLeave: null,
-          leave: null,
-          afterLeave: null,
-          leaveCancelled: null
-        }
-      }
-    }
-  }
-}
-</script>
diff --git a/lib/app/components/nuxt-link.js b/lib/app/components/nuxt-link.js
new file mode 100644
index 0000000000..c23fdd7ac3
--- /dev/null
+++ b/lib/app/components/nuxt-link.js
@@ -0,0 +1,9 @@
+import Vue from 'vue'
+
+export default {
+  name: 'nuxt-link',
+  functional: true,
+  render (h, { data, children }) {
+    return h('router-link', data, children)
+  }
+}
diff --git a/lib/app/components/nuxt.vue b/lib/app/components/nuxt.vue
index a95b9d40d9..743984a1b7 100644
--- a/lib/app/components/nuxt.vue
+++ b/lib/app/components/nuxt.vue
@@ -1,15 +1,14 @@
 <template>
   <div>
     <% if (loading) { %><nuxt-loading ref="loading"></nuxt-loading><% } %>
-    <transition :name="nuxt.transition.name" :mode="nuxt.transition.mode">
-      <router-view v-if="!nuxt.err"></router-view>
-      <nuxt-error v-if="nuxt.err" :error="nuxt.err"></nuxt-error>
-    </transition>
+    <nuxt-child v-if="!nuxt.err"></nuxt-child>
+    <nuxt-error v-if="nuxt.err" :error="nuxt.err"></nuxt-error>
   </div>
 </template>
 
 <script>
 import Vue from 'vue'
+import NuxtChild from './nuxt-child'
 import NuxtError from '<%= components.ErrorPage %>'
 <% if (loading) { %>import NuxtLoading from '<%= (typeof loading === "string" ? loading : "./nuxt-loading.vue") %>'<% } %>
 
@@ -47,6 +46,7 @@ export default {
   },
   <% } %>
   components: {
+    NuxtChild,
     NuxtError<%= (loading ? ',\n    NuxtLoading' : '') %>
   }
 }
diff --git a/lib/app/index.js b/lib/app/index.js
index 91fcf7f98c..7e6eba54f9 100644
--- a/lib/app/index.js
+++ b/lib/app/index.js
@@ -5,7 +5,8 @@ import Meta from 'vue-meta'
 import router from './router.js'
 <% if (store) { %>import store from '~store/index.js'<% } %>
 import NuxtContainer from './components/nuxt-container.vue'
-import NuxtChild from './components/nuxt-child.vue'
+import NuxtChild from './components/nuxt-child.js'
+import NuxtLink from './components/nuxt-link.js'
 import Nuxt from './components/nuxt.vue'
 import App from '<%= appPath %>'
 
@@ -13,6 +14,8 @@ import App from '<%= appPath %>'
 Vue.component(NuxtContainer.name, NuxtContainer)
 // Component: <nuxt-child>
 Vue.component(NuxtChild.name, NuxtChild)
+// Component: <nuxt-link>
+Vue.component(NuxtLink.name, NuxtLink)
 // Component: <nuxt>
 Vue.component(Nuxt.name, Nuxt)
 
@@ -46,16 +49,24 @@ const app = {
   router,
   <%= (store ? 'store,' : '') %>
   _nuxt: {
-    transition: Object.assign({}, defaultTransition),
-    setTransition (transition) {
-      if (!transition) {
-        transition = defaultTransition
-      } else if (typeof transition === 'string') {
-        transition = Object.assign({}, defaultTransition, { name: transition })
+    defaultTransition: defaultTransition,
+    transitions: [ defaultTransition ],
+    setTransitions (transitions) {
+      if (!Array.isArray(transitions)) {
+        transitions = [ transitions ]
       }
-      this.$options._nuxt.transition.name = transition.name
-      this.$options._nuxt.transition.mode = transition.mode
-      return transition
+      transitions = transitions.map((transition) => {
+        if (!transition) {
+          transition = defaultTransition
+        } else if (typeof transition === 'string') {
+          transition = Object.assign({}, defaultTransition, { name: transition })
+        } else {
+          transition = Object.assign({}, defaultTransition, transition)
+        }
+        return transition
+      })
+      this.$options._nuxt.transitions = transitions
+      return transitions
     },
     err: null,
     error (err) {
diff --git a/lib/build/index.js b/lib/build/index.js
index 1b57fed562..e81f968a2e 100644
--- a/lib/build/index.js
+++ b/lib/build/index.js
@@ -151,10 +151,11 @@ function * generateRoutesAndFiles () {
     'router.js',
     'server.js',
     'utils.js',
-    'components/nuxt-child.vue',
     'components/nuxt-container.vue',
-    'components/nuxt.vue',
-    'components/nuxt-loading.vue'
+    'components/nuxt-loading.vue',
+    'components/nuxt-child.js',
+    'components/nuxt-link.js',
+    'components/nuxt.vue'
   ]
   let templateVars = {
     uniqBy: _.uniqBy,

From a31dc539cc8a86a5104e1336e9a18eaf4f7f2da2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Fri, 16 Dec 2016 17:46:09 +0100
Subject: [PATCH 36/42] Call only the children data for better perf

---
 lib/app/client.js | 33 +++++++++++++++++++++++++++------
 1 file changed, 27 insertions(+), 6 deletions(-)

diff --git a/lib/app/client.js b/lib/app/client.js
index 01e755d2f9..224315c80e 100644
--- a/lib/app/client.js
+++ b/lib/app/client.js
@@ -4,9 +4,20 @@ require('es6-object-assign').polyfill()
 import 'es6-promise/auto'
 import Vue from 'vue'
 import { app, router<%= (store ? ', store' : '') %> } from './index'
-import { getMatchedComponents, getMatchedComponentsInstances, flatMapComponents, getContext, promisify, getLocation } from './utils'
+import { getMatchedComponents, getMatchedComponentsInstances, flatMapComponents, getContext, promisify, getLocation, compile } from './utils'
 const noopData = () => { return {} }
 const noopFetch = () => {}
+let _lastPaths = []
+
+function mapTransitions(Components, to, from) {
+  return Components.map((Component) => {
+    let transition = Component.options.transition
+    if (typeof transition === 'function') {
+      return transition(to, from)
+    }
+    return transition
+  })
+}
 
 function loadAsyncComponents (to, ___, next) {
   const resolveComponents = flatMapComponents(to, (Component, _, match, key) => {
@@ -44,7 +55,7 @@ function loadAsyncComponents (to, ___, next) {
   })
 }
 
-function render (to, ___, next) {
+function render (to, from, next) {
   let Components = getMatchedComponents(to)
   if (!Components.length) {
     this.error({ statusCode: 404, message: 'This page could not be found.', url: to.path })
@@ -67,7 +78,7 @@ function render (to, ___, next) {
       }
     }
   })
-  this.setTransition(Components[0].options.transition)
+  this.setTransitions(mapTransitions(Components, to, from))
   this.error()
   let nextCalled = false
   let isValid = Components.some((Component) => {
@@ -81,7 +92,12 @@ function render (to, ___, next) {
     this.error({ statusCode: 404, message: 'This page could not be found.', url: to.path })
     return next()
   }
-  Promise.all(Components.map((Component) => {
+  Promise.all(Components.map((Component, i) => {
+    // Check if only children route changed
+    Component._path = compile(to.matched[i].path)(to.params)
+    if (Component._path === _lastPaths[i] && (i + 1) !== Components.length) {
+      return Promise.resolve()
+    }
     let promises = []
     const _next = function (path) {
       <%= (loading ? 'this.$loading.finish && this.$loading.finish()' : '') %>
@@ -111,6 +127,7 @@ function render (to, ___, next) {
     return Promise.all(promises)
   }))
   .then(() => {
+    _lastPaths = Components.map((Component, i) => compile(to.matched[i].path)(to.params))
     <%= (loading ? 'this.$loading.finish && this.$loading.finish()' : '') %>
     // If not redirected
     if (!nextCalled) {
@@ -118,6 +135,7 @@ function render (to, ___, next) {
     }
   })
   .catch((error) => {
+    _lastPaths = []
     this.error(error)
     next(false)
   })
@@ -268,8 +286,11 @@ Promise.all(resolveComponents)
     store.replaceState(NUXT.state)
   }
   <% } %>
-  _app.setTransition = _app.$options._nuxt.setTransition.bind(_app)
-  if (Components.length) _app.setTransition(Components[0].options.transition)
+  _app.setTransitions = _app.$options._nuxt.setTransitions.bind(_app)
+  if (Components.length) {
+    _app.setTransitions(mapTransitions(Components, router.currentRoute))
+    _lastPaths = router.currentRoute.matched.map((route) => compile(route.path)(router.currentRoute.params))
+  }
   _app.error = _app.$options._nuxt.error.bind(_app)
   _app.$loading = {} // to avoid error while _app.$nuxt does not exist
   if (NUXT.error) _app.error(NUXT.error)

From 36f3d48ece8c979e77da88d136f3d4449fb3ba18 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Fri, 16 Dec 2016 17:46:30 +0100
Subject: [PATCH 37/42] Custom route example

---
 examples/custom-routes/layouts/app.vue        | 15 ++++++++
 examples/custom-routes/nuxt.config.js         |  3 +-
 examples/custom-routes/pages/posts/_slug.vue  | 11 +++---
 .../custom-routes/pages/posts/_slug/_name.vue | 35 +++++++++++++++++++
 .../pages/posts/_slug/comments.vue            |  6 ++++
 examples/custom-routes/pages/users.vue        | 19 +---------
 examples/custom-routes/pages/users/_id.vue    | 20 ++++++++---
 7 files changed, 78 insertions(+), 31 deletions(-)

diff --git a/examples/custom-routes/layouts/app.vue b/examples/custom-routes/layouts/app.vue
index 51266bc962..8b2e9e3f0d 100644
--- a/examples/custom-routes/layouts/app.vue
+++ b/examples/custom-routes/layouts/app.vue
@@ -102,4 +102,19 @@ a, a:hover
 .fade-enter, .fade-leave-active {
   opacity: 0;
 }
+
+.bounce-enter-active {
+  animation: bounce-in .8s;
+}
+.bounce-leave-active {
+  animation: bounce-out .5s;
+}
+@keyframes bounce-in {
+  0% { transform: scale(0) }
+  100% { transform: scale(1) }
+}
+@keyframes bounce-out {
+  0% { transform: scale(1) }
+  100% { transform: scale(0) }
+}
 </style>
diff --git a/examples/custom-routes/nuxt.config.js b/examples/custom-routes/nuxt.config.js
index 56133cacc2..712b2977b1 100644
--- a/examples/custom-routes/nuxt.config.js
+++ b/examples/custom-routes/nuxt.config.js
@@ -11,5 +11,6 @@ module.exports = {
       '/projects/:slug': [{slug: 'toto'}, {slug: 'titi'}, {slug: 'tutu'}]
     }
   },
-  transition: 'fade'
+  transition: 'fade',
+  loading: false
 }
diff --git a/examples/custom-routes/pages/posts/_slug.vue b/examples/custom-routes/pages/posts/_slug.vue
index 8fb06ed47b..41cc7a75f2 100644
--- a/examples/custom-routes/pages/posts/_slug.vue
+++ b/examples/custom-routes/pages/posts/_slug.vue
@@ -5,14 +5,11 @@
       Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
     </p>
     <p>
-      <router-link :to="{ name: 'posts-slug-name', params: { name: 'foo'} }">
-        Foo
-      </router-link>
-      <router-link :to="{ name: 'posts-slug-name', params: { name: 'bar'} }">
-        Bar
-      </router-link>
+      <nuxt-link :to="{ name: 'posts-slug-name', params: { name: 'foo'} }">Foo</nuxt-link>
+      <nuxt-link :to="{ name: 'posts-slug-name', params: { name: 'bar'} }">Bar</nuxt-link>
+      <nuxt-link :to="{ name: 'posts-slug-comments' }">Comments</nuxt-link>
     </p>
-    <router-view></router-view>
+    <nuxt-child :key="$route.params.name"></nuxt-child>
   </div>
 </template>
 
diff --git a/examples/custom-routes/pages/posts/_slug/_name.vue b/examples/custom-routes/pages/posts/_slug/_name.vue
index 17379f0182..79598d5cdd 100644
--- a/examples/custom-routes/pages/posts/_slug/_name.vue
+++ b/examples/custom-routes/pages/posts/_slug/_name.vue
@@ -7,6 +7,41 @@
   </div>
 </template>
 
+<script>
+export default {
+  transition: {
+    name: 'bounce',
+    // css: true,
+    beforeEnter (el) {
+      console.log('Before enter');
+    },
+    enter (el) {
+      console.log('Enter')
+      // done()
+    },
+    afterEnter (el) {
+      console.log('After enter')
+    },
+    enterCancelled (el) {
+      console.log('Enter cancelled')
+    },
+    beforeLeave (el) {
+      console.log('Before leave')
+    },
+    leave (el) {
+      console.log('Leave')
+      // done()
+    },
+    afterLeave (el) {
+      console.log('After leave')
+    },
+    leaveCancelled (el) {
+      console.log('Leave cancelled')
+    }
+  }
+}
+</script>
+
 <style scoped>
 p
 {
diff --git a/examples/custom-routes/pages/posts/_slug/comments.vue b/examples/custom-routes/pages/posts/_slug/comments.vue
index 62cdad11f6..346a217267 100644
--- a/examples/custom-routes/pages/posts/_slug/comments.vue
+++ b/examples/custom-routes/pages/posts/_slug/comments.vue
@@ -3,3 +3,9 @@
     Comments only
   </div>
 </template>
+
+<style scoped>
+.container {
+  padding: 20px;
+}
+</style>
diff --git a/examples/custom-routes/pages/users.vue b/examples/custom-routes/pages/users.vue
index be67b73e0a..c508aba21e 100644
--- a/examples/custom-routes/pages/users.vue
+++ b/examples/custom-routes/pages/users.vue
@@ -7,7 +7,7 @@
         <router-link :to="{ name: 'users-id', params: { id: user.id } }">{{ user.name }}</router-link>
       </li>
     </ul>
-    <router-view></router-view>
+    <nuxt-child :key="$route.params.id"></nuxt-child>
   </div>
 </template>
 
@@ -46,21 +46,4 @@ export default {
 .router-link-active {
   color: #41b883 !important;
 }
-.bounce-enter-active {
-  animation: bounce-in .8s;
-}
-.bounce-leave-active {
-  animation: bounce-out .5s;
-}
-@keyframes bounce-in {
-  0% { transform: scale(0) }
-  50% { transform: scale(1.5) }
-  100% { transform: scale(1) }
-}
-@keyframes bounce-out {
-  0% { transform: scale(1) }
-  50% { transform: scale(1.5) }
-  100% { transform: scale(0) }
-}
-
 </style>
diff --git a/examples/custom-routes/pages/users/_id.vue b/examples/custom-routes/pages/users/_id.vue
index 7151655af8..942b276bb9 100644
--- a/examples/custom-routes/pages/users/_id.vue
+++ b/examples/custom-routes/pages/users/_id.vue
@@ -12,6 +12,10 @@
 import axios from 'axios'
 
 export default {
+  transition (to, from) {
+    if (!from || !from.params.id || !to.params.id) return 'fade'
+    return +to.params.id > +from.params.id ? 'slide-left' : 'slide-right'
+  },
   data ({ params, error }) {
     return axios.get(`https://jsonplaceholder.typicode.com/users/${params.id}`)
     .then((res) => { return { user: res.data } })
@@ -28,10 +32,16 @@ export default {
   text-align: center;
   overflow: hidden;
   min-height: 440px;
+  transition: all .5s cubic-bezier(.55,0,.1,1);
+}
+.slide-left-enter,
+.slide-right-leave-active {
+  opacity: 0;
+  transform: translate(30px, 0);
+}
+.slide-left-leave-active,
+.slide-right-enter {
+  opacity: 0;
+  transform: translate(-30px, 0);
 }
-/*.user {
-  text-align: center;
-  margin-top: 100px;
-  font-family: sans-serif;
-}*/
 </style>

From 0142dae00895888ba923dabe9786f65226bf85d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Fri, 16 Dec 2016 18:12:38 +0100
Subject: [PATCH 38/42] Replace router-link to nuxt-link

---
 examples/async-data/pages/index.vue           |  2 +-
 examples/async-data/pages/post.vue            |  2 +-
 examples/auth-routes/README.md                |  2 +-
 examples/auth-routes/pages/index.vue          |  2 +-
 examples/auth-routes/pages/secret.vue         |  2 +-
 examples/custom-loading/pages/about.vue       |  2 +-
 examples/custom-loading/pages/index.vue       |  2 +-
 examples/custom-routes/layouts/app.vue        | 20 +++++++++++--------
 examples/custom-routes/pages/posts/index.vue  |  4 ++--
 .../custom-routes/pages/projects/index.vue    |  4 ++--
 examples/custom-routes/pages/users.vue        |  5 +----
 examples/custom-routes/pages/users/_id.vue    |  2 +-
 examples/extend-app/pages/about.vue           |  2 +-
 examples/extend-app/pages/index.vue           |  2 +-
 examples/global-css/pages/about.vue           |  4 ++--
 examples/global-css/pages/index.vue           |  4 ++--
 examples/head-elements/pages/about.vue        |  2 +-
 examples/head-elements/pages/index.vue        |  2 +-
 examples/hello-world/pages/index.vue          |  2 +-
 examples/plugins-vendor/pages/about.vue       |  2 +-
 examples/plugins-vendor/pages/index.vue       |  2 +-
 examples/routes-transitions/README.md         |  2 +-
 examples/routes-transitions/pages/about.vue   |  2 +-
 examples/routes-transitions/pages/index.vue   |  2 +-
 examples/static-images/pages/about.vue        |  2 +-
 examples/static-images/pages/index.vue        |  2 +-
 examples/vuex-store/pages/about.vue           |  2 +-
 examples/vuex-store/pages/index.vue           |  2 +-
 lib/app/components/nuxt-error.vue             |  2 +-
 lib/nuxt.js                                   |  3 +--
 30 files changed, 45 insertions(+), 45 deletions(-)

diff --git a/examples/async-data/pages/index.vue b/examples/async-data/pages/index.vue
index 8d081f0a67..ab51ddce0b 100644
--- a/examples/async-data/pages/index.vue
+++ b/examples/async-data/pages/index.vue
@@ -2,7 +2,7 @@
 <template>
   <div>
     <p>{{ userAgent }}</p>
-    <p><router-link to="/post">See a post (http request / Ajax)</router-link></p>
+    <p><nuxt-link to="/post">See a post (http request / Ajax)</nuxt-link></p>
   </div>
 </template>
 
diff --git a/examples/async-data/pages/post.vue b/examples/async-data/pages/post.vue
index c1339a506e..c7c2457fa9 100644
--- a/examples/async-data/pages/post.vue
+++ b/examples/async-data/pages/post.vue
@@ -2,7 +2,7 @@
 <template>
   <div>
     <p>{{ post.title }}!</p>
-    <p><router-link to="/">Back home</router-link></p>
+    <p><nuxt-link to="/">Back home</nuxt-link></p>
   </div>
 </template>
 
diff --git a/examples/auth-routes/README.md b/examples/auth-routes/README.md
index 88bb640b2b..9d11d26577 100644
--- a/examples/auth-routes/README.md
+++ b/examples/auth-routes/README.md
@@ -183,7 +183,7 @@ Let's add a `/secret` route where only the connected user can see its content:
 <template>
   <div>
     <h1>Super secret page</h1>
-    <router-link to="/">Back to the home page</router-link>
+    <nuxt-link to="/">Back to the home page</nuxt-link>
   </div>
 </template>
 
diff --git a/examples/auth-routes/pages/index.vue b/examples/auth-routes/pages/index.vue
index 7ff1293bda..b60f3adefe 100644
--- a/examples/auth-routes/pages/index.vue
+++ b/examples/auth-routes/pages/index.vue
@@ -14,7 +14,7 @@
       <p><i>You can also refresh this page, you'll still be connected!</i></p>
       <button @click="logout">Logout</button>
     </div>
-    <p><router-link to="/secret">Super secret page</router-link></p>
+    <p><nuxt-link to="/secret">Super secret page</nuxt-link></p>
   </div>
 </template>
 
diff --git a/examples/auth-routes/pages/secret.vue b/examples/auth-routes/pages/secret.vue
index 0adfb98859..776201a1e7 100644
--- a/examples/auth-routes/pages/secret.vue
+++ b/examples/auth-routes/pages/secret.vue
@@ -2,7 +2,7 @@
   <div>
     <h1>Super secret page</h1>
     <p>If you try to access this URL not connected, you will be redirected to the home page (server-side or client-side)</p>
-    <router-link to="/">Back to the home page</router-link>
+    <nuxt-link to="/">Back to the home page</nuxt-link>
   </div>
 </template>
 
diff --git a/examples/custom-loading/pages/about.vue b/examples/custom-loading/pages/about.vue
index 1712f4eb9f..a923de6b96 100644
--- a/examples/custom-loading/pages/about.vue
+++ b/examples/custom-loading/pages/about.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="container">
     <p>About Page</p>
-    <router-link to="/">Go to /</router-link>
+    <nuxt-link to="/">Go to /</nuxt-link>
   </div>
 </template>
 
diff --git a/examples/custom-loading/pages/index.vue b/examples/custom-loading/pages/index.vue
index fcfb70a764..1c536b4126 100644
--- a/examples/custom-loading/pages/index.vue
+++ b/examples/custom-loading/pages/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="container">
     <p>Hello {{ name }}!</p>
-    <router-link to="/about">Go to /about</router-link>
+    <nuxt-link to="/about">Go to /about</nuxt-link>
   </div>
 </template>
 
diff --git a/examples/custom-routes/layouts/app.vue b/examples/custom-routes/layouts/app.vue
index 8b2e9e3f0d..156f39b3d8 100644
--- a/examples/custom-routes/layouts/app.vue
+++ b/examples/custom-routes/layouts/app.vue
@@ -6,24 +6,24 @@
       </h1>
       <ul class="Navbar__Links">
         <li class="Navbar__Links__Item">
-          <router-link to="/team" class="Navbar__Links__Item__Link">
+          <nuxt-link to="/team" class="Navbar__Links__Item__Link">
             Basic route
-          </router-link>
+          </nuxt-link>
         </li>
         <li class="Navbar__Links__Item">
-          <router-link to="/projects" class="Navbar__Links__Item__Link">
+          <nuxt-link to="/projects" class="Navbar__Links__Item__Link">
             Dynamic routes
-          </router-link>
+          </nuxt-link>
         </li>
         <li class="Navbar__Links__Item">
-          <router-link to="/users" class="Navbar__Links__Item__Link">
+          <nuxt-link to="/users" class="Navbar__Links__Item__Link">
             Nested routes
-          </router-link>
+          </nuxt-link>
         </li>
         <li class="Navbar__Links__Item">
-          <router-link to="/posts" class="Navbar__Links__Item__Link">
+          <nuxt-link to="/posts" class="Navbar__Links__Item__Link">
             Dynamic nested routes
-          </router-link>
+          </nuxt-link>
         </li>
       </ul>
     </nav>
@@ -96,6 +96,10 @@ a, a:hover
   color: #41B883;
 }
 
+.nuxt-link-active {
+  color: #41B883 !important;
+}
+
 .fade-enter-active, .fade-leave-active {
   transition: opacity .3s;
 }
diff --git a/examples/custom-routes/pages/posts/index.vue b/examples/custom-routes/pages/posts/index.vue
index cdc4114f57..e1aafcac46 100644
--- a/examples/custom-routes/pages/posts/index.vue
+++ b/examples/custom-routes/pages/posts/index.vue
@@ -2,9 +2,9 @@
   <div class="container">
     <h2>Posts list</h2>
     <p>
-      <router-link to="/posts/welcome">
+      <nuxt-link to="/posts/welcome">
         Welcome post
-      </router-link>
+      </nuxt-link>
     </p>
   </div>
 </template>
diff --git a/examples/custom-routes/pages/projects/index.vue b/examples/custom-routes/pages/projects/index.vue
index 4a1026b0cd..32e21bc91d 100644
--- a/examples/custom-routes/pages/projects/index.vue
+++ b/examples/custom-routes/pages/projects/index.vue
@@ -3,9 +3,9 @@
     <h1>Dynamic route example</h1>
     <h2>Projects list</h2>
     <p>
-      <router-link :to="{ name: 'projects-slug', params: { slug: 'nuxtjs'} }">
+      <nuxt-link :to="{ name: 'projects-slug', params: { slug: 'nuxtjs'} }">
         Nuxt.js
-      </router-link>
+      </nuxt-link>
     </p>
   </div>
 </template>
diff --git a/examples/custom-routes/pages/users.vue b/examples/custom-routes/pages/users.vue
index c508aba21e..e9b2898931 100644
--- a/examples/custom-routes/pages/users.vue
+++ b/examples/custom-routes/pages/users.vue
@@ -4,7 +4,7 @@
     <h2>Users list</h2>
     <ul class="users">
       <li v-for="user in users">
-        <router-link :to="{ name: 'users-id', params: { id: user.id } }">{{ user.name }}</router-link>
+        <nuxt-link :to="{ name: 'users-id', params: { id: user.id } }">{{ user.name }}</nuxt-link>
       </li>
     </ul>
     <nuxt-child :key="$route.params.id"></nuxt-child>
@@ -43,7 +43,4 @@ export default {
 .users li a:hover {
   color: #41b883;
 }
-.router-link-active {
-  color: #41b883 !important;
-}
 </style>
diff --git a/examples/custom-routes/pages/users/_id.vue b/examples/custom-routes/pages/users/_id.vue
index 942b276bb9..5093e69ff9 100644
--- a/examples/custom-routes/pages/users/_id.vue
+++ b/examples/custom-routes/pages/users/_id.vue
@@ -4,7 +4,7 @@
     <h3>{{ user.name }}</h3>
     <h4>@{{ user.username }}</h4>
     <p>Email : {{ user.email }}</p>
-    <p><router-link to="/users">List of users</router-link></p>
+    <p><nuxt-link to="/users">List of users</nuxt-link></p>
   </div>
 </template>
 
diff --git a/examples/extend-app/pages/about.vue b/examples/extend-app/pages/about.vue
index cb9849695c..7ed044bcba 100644
--- a/examples/extend-app/pages/about.vue
+++ b/examples/extend-app/pages/about.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <p>Hi from {{ name }}</p>
-    <router-link to="/">Home page</router-link>
+    <nuxt-link to="/">Home page</nuxt-link>
   </div>
 </template>
 
diff --git a/examples/extend-app/pages/index.vue b/examples/extend-app/pages/index.vue
index 14713d2a05..bb96d34c35 100644
--- a/examples/extend-app/pages/index.vue
+++ b/examples/extend-app/pages/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="container">
     <h1>Welcome!</h1>
-    <router-link to="/about">About page</router-link>
+    <nuxt-link to="/about">About page</nuxt-link>
   </div>
 </template>
diff --git a/examples/global-css/pages/about.vue b/examples/global-css/pages/about.vue
index f3a7b471a5..33c5802721 100644
--- a/examples/global-css/pages/about.vue
+++ b/examples/global-css/pages/about.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="content">
     <h1 class="title">Another Page</h1>
-    <p><router-link to="/" class="button is-medium is-info hvr-wobble-vertical">Another button</router-link></p>
-    <p><router-link to="/">Back home</router-link></p>
+    <p><nuxt-link to="/" class="button is-medium is-info hvr-wobble-vertical">Another button</nuxt-link></p>
+    <p><nuxt-link to="/">Back home</nuxt-link></p>
   </div>
 </template>
diff --git a/examples/global-css/pages/index.vue b/examples/global-css/pages/index.vue
index df0eaa2a00..97df0b1c22 100644
--- a/examples/global-css/pages/index.vue
+++ b/examples/global-css/pages/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="content">
     <h1 class="title">Custom CSS!</h1>
-    <p><router-link to="/about" class="button is-medium is-primary hvr-float-shadow">I am a button</router-link></p>
-    <p><router-link to="/about">About page</router-link></p>
+    <p><nuxt-link to="/about" class="button is-medium is-primary hvr-float-shadow">I am a button</nuxt-link></p>
+    <p><nuxt-link to="/about">About page</nuxt-link></p>
   </div>
 </template>
diff --git a/examples/head-elements/pages/about.vue b/examples/head-elements/pages/about.vue
index a4b465cf4e..3a63a3d83d 100644
--- a/examples/head-elements/pages/about.vue
+++ b/examples/head-elements/pages/about.vue
@@ -3,7 +3,7 @@
     <h1>About page</h1>
     <p>Click below to see the custom meta tags added with our custom component <code>twitter-head-card</code></p>
     <twitter-head-card></twitter-head-card>
-    <p><router-link to="/">Home page</router-link></p>
+    <p><nuxt-link to="/">Home page</nuxt-link></p>
   </div>
 </template>
 
diff --git a/examples/head-elements/pages/index.vue b/examples/head-elements/pages/index.vue
index 6cb9688640..a613b81b47 100755
--- a/examples/head-elements/pages/index.vue
+++ b/examples/head-elements/pages/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="container">
     <h1>Home page 🚀</h1>
-    <router-link to="/about">About page</router-link>
+    <nuxt-link to="/about">About page</nuxt-link>
   </div>
 </template>
 
diff --git a/examples/hello-world/pages/index.vue b/examples/hello-world/pages/index.vue
index 0f54495bd6..9655d7d866 100755
--- a/examples/hello-world/pages/index.vue
+++ b/examples/hello-world/pages/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
     <h1>Welcome!</h1>
-    <router-link to="/about">About page</router-link>
+    <nuxt-link to="/about">About page</nuxt-link>
   </div>
 </template>
diff --git a/examples/plugins-vendor/pages/about.vue b/examples/plugins-vendor/pages/about.vue
index da2464fc0e..a82a6a3a92 100644
--- a/examples/plugins-vendor/pages/about.vue
+++ b/examples/plugins-vendor/pages/about.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="container">
     <img :src="thumbnailUrl" />
-    <p><router-link to="/">Home</router-link> - About</p>
+    <p><nuxt-link to="/">Home</nuxt-link> - About</p>
   </div>
 </template>
 
diff --git a/examples/plugins-vendor/pages/index.vue b/examples/plugins-vendor/pages/index.vue
index fc6ce62980..d32a12873f 100644
--- a/examples/plugins-vendor/pages/index.vue
+++ b/examples/plugins-vendor/pages/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="container">
     <p><button @click="showLoginError">Notif me!</button></p>
-    <p>Home - <router-link to="/about">About</router-link></p>
+    <p>Home - <nuxt-link to="/about">About</nuxt-link></p>
   </div>
 </template>
 
diff --git a/examples/routes-transitions/README.md b/examples/routes-transitions/README.md
index f8a2c49b00..8f7bdd5e0e 100644
--- a/examples/routes-transitions/README.md
+++ b/examples/routes-transitions/README.md
@@ -71,7 +71,7 @@ To define a custom transition for a specific route, simply add the `transition`
 <template>
   <div class="container">
     <h1>About page</h1>
-    <router-link to="/">Home page</router-link>
+    <nuxt-link to="/">Home page</nuxt-link>
   </div>
 </template>
 
diff --git a/examples/routes-transitions/pages/about.vue b/examples/routes-transitions/pages/about.vue
index 430c3c40fe..bfeea07ec2 100644
--- a/examples/routes-transitions/pages/about.vue
+++ b/examples/routes-transitions/pages/about.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="container">
     <h1>About page</h1>
-    <router-link to="/">Home page</router-link>
+    <nuxt-link to="/">Home page</nuxt-link>
   </div>
 </template>
 
diff --git a/examples/routes-transitions/pages/index.vue b/examples/routes-transitions/pages/index.vue
index 6945425a2a..dfbaebf001 100644
--- a/examples/routes-transitions/pages/index.vue
+++ b/examples/routes-transitions/pages/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="container">
     <h1>Home page</h1>
-    <router-link to="/about">About page</router-link>
+    <nuxt-link to="/about">About page</nuxt-link>
   </div>
 </template>
diff --git a/examples/static-images/pages/about.vue b/examples/static-images/pages/about.vue
index 9f27ecf056..dbd612f9f6 100644
--- a/examples/static-images/pages/about.vue
+++ b/examples/static-images/pages/about.vue
@@ -3,7 +3,7 @@
     <img src="~static/nuxt-black.png" />
     <h2>Thank you for testing nuxt.js</h2>
     <p>Loaded from the {{ name }}</p>
-    <p><router-link to="/">Back home</router-link></p>
+    <p><nuxt-link to="/">Back home</nuxt-link></p>
   </div>
 </template>
 
diff --git a/examples/static-images/pages/index.vue b/examples/static-images/pages/index.vue
index 95aaf9fced..2a0ea29a3e 100644
--- a/examples/static-images/pages/index.vue
+++ b/examples/static-images/pages/index.vue
@@ -2,7 +2,7 @@
   <div class="container">
     <img src="nuxt.png" />
     <h2>Hello World.</h2>
-    <p><router-link to="/about">About</router-link></p>
+    <p><nuxt-link to="/about">About</nuxt-link></p>
   </div>
 </template>
 
diff --git a/examples/vuex-store/pages/about.vue b/examples/vuex-store/pages/about.vue
index 734bf8e201..f489bfe089 100644
--- a/examples/vuex-store/pages/about.vue
+++ b/examples/vuex-store/pages/about.vue
@@ -2,7 +2,7 @@
   <div>
     <p>
       <button @click="$store.commit('increment')">{{ $store.state.counter }}</button><br>
-      <router-link to="/">Home</router-link>
+      <nuxt-link to="/">Home</nuxt-link>
     </p>
   </div>
 </template>
diff --git a/examples/vuex-store/pages/index.vue b/examples/vuex-store/pages/index.vue
index cf3bfa73a7..3ebbfdcac6 100644
--- a/examples/vuex-store/pages/index.vue
+++ b/examples/vuex-store/pages/index.vue
@@ -2,7 +2,7 @@
   <div>
     <p>
       <button @click="increment">{{ counter }}</button><br>
-      <router-link to="/about">About</router-link>
+      <nuxt-link to="/about">About</nuxt-link>
     </p>
   </div>
 </template>
diff --git a/lib/app/components/nuxt-error.vue b/lib/app/components/nuxt-error.vue
index dbee65a48c..476d67d441 100644
--- a/lib/app/components/nuxt-error.vue
+++ b/lib/app/components/nuxt-error.vue
@@ -5,7 +5,7 @@
       <div class="error-wrapper-message">
         <h2 class="error-message">{{ error.message }}</h2>
       </div>
-      <p v-if="error.statusCode === 404"><router-link class="error-link" to="/">Back to the home page</router-link></p>
+      <p v-if="error.statusCode === 404"><nuxt-link class="error-link" to="/">Back to the home page</nuxt-link></p>
     </div>
   </div>
 </template>
diff --git a/lib/nuxt.js b/lib/nuxt.js
index 065e1d7ab7..938656041f 100644
--- a/lib/nuxt.js
+++ b/lib/nuxt.js
@@ -39,8 +39,7 @@ class Nuxt {
       },
       router: {
         base: '/',
-        linkActiveClass: 'router-link-active',
-        routes: {}
+        linkActiveClass: 'nuxt-link-active'
       },
       build: {}
     }

From 8b4429485846b57be777f819a8bda796694b2570 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Fri, 16 Dec 2016 18:13:53 +0100
Subject: [PATCH 39/42] Typo

---
 examples/custom-routes/README.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/examples/custom-routes/README.md b/examples/custom-routes/README.md
index 5751a2950d..c9a7de5485 100644
--- a/examples/custom-routes/README.md
+++ b/examples/custom-routes/README.md
@@ -92,8 +92,8 @@ export default {
 
 ## Nested Routes (children)
 
-To define a nested route, you need to define a .vue file with the same name as the directory wich contain your children views.
-> Don't forget to put `<router-view></router-view>` inside your parent .vue file.
+To define a nested route, you need to define a .vue file with the same name as the directory which contain your children views.
+> Don't forget to put `<nuxt-child></nuxt-child>` inside your parent .vue file.
 
 This file tree:
 

From 8eb6b5e3b60670110aee6a25033d9b9ebaf27751 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Mon, 19 Dec 2016 20:17:52 +0100
Subject: [PATCH 40/42] remove console.log

---
 lib/app/client.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/lib/app/client.js b/lib/app/client.js
index 224315c80e..c938cd6abe 100644
--- a/lib/app/client.js
+++ b/lib/app/client.js
@@ -24,7 +24,6 @@ function loadAsyncComponents (to, ___, next) {
     if (typeof Component === 'function' && !Component.options) {
       return new Promise(function (resolve, reject) {
         const _resolve = (Component) => {
-          // console.log('Component loaded', Component, match.path, key)
           if (!Component.options) {
             Component = Vue.extend(Component) // fix issue #6
             Component._Ctor = Component
@@ -61,7 +60,6 @@ function render (to, from, next) {
     this.error({ statusCode: 404, message: 'This page could not be found.', url: to.path })
     return next()
   }
-  // console.log('Load components', Components, to.path)
   // Update ._data and other properties if hot reloaded
   Components.forEach(function (Component) {
     if (!Component._data) {

From eabcf490b13824802d112267790ad6b086506a29 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Mon, 19 Dec 2016 20:35:34 +0100
Subject: [PATCH 41/42] Simplify example

---
 examples/custom-routes/layouts/app.vue        | 124 ------------------
 examples/custom-routes/nuxt.config.js         |  13 +-
 examples/custom-routes/pages/index.vue        |  46 ++++++-
 examples/custom-routes/pages/posts.vue        |   6 -
 examples/custom-routes/pages/posts/_slug.vue  |  26 ----
 .../custom-routes/pages/posts/_slug/_name.vue |  51 -------
 .../pages/posts/_slug/comments.vue            |  11 --
 examples/custom-routes/pages/posts/index.vue  |  17 ---
 .../custom-routes/pages/projects/_slug.vue    |  24 ----
 .../custom-routes/pages/projects/index.vue    |  18 ---
 examples/custom-routes/pages/team/index.vue   |   5 -
 examples/custom-routes/pages/users.vue        |  46 -------
 examples/custom-routes/pages/users/_id.vue    |  38 ++----
 13 files changed, 55 insertions(+), 370 deletions(-)
 delete mode 100644 examples/custom-routes/layouts/app.vue
 delete mode 100644 examples/custom-routes/pages/posts.vue
 delete mode 100644 examples/custom-routes/pages/posts/_slug.vue
 delete mode 100644 examples/custom-routes/pages/posts/_slug/_name.vue
 delete mode 100644 examples/custom-routes/pages/posts/_slug/comments.vue
 delete mode 100644 examples/custom-routes/pages/posts/index.vue
 delete mode 100644 examples/custom-routes/pages/projects/_slug.vue
 delete mode 100644 examples/custom-routes/pages/projects/index.vue
 delete mode 100644 examples/custom-routes/pages/team/index.vue
 delete mode 100644 examples/custom-routes/pages/users.vue

diff --git a/examples/custom-routes/layouts/app.vue b/examples/custom-routes/layouts/app.vue
deleted file mode 100644
index 156f39b3d8..0000000000
--- a/examples/custom-routes/layouts/app.vue
+++ /dev/null
@@ -1,124 +0,0 @@
-<template>
-  <nuxt-container>
-    <nav class="Navbar clearfix">
-      <h1 class="Navbar__Title">
-        Nuxt Custom Routes
-      </h1>
-      <ul class="Navbar__Links">
-        <li class="Navbar__Links__Item">
-          <nuxt-link to="/team" class="Navbar__Links__Item__Link">
-            Basic route
-          </nuxt-link>
-        </li>
-        <li class="Navbar__Links__Item">
-          <nuxt-link to="/projects" class="Navbar__Links__Item__Link">
-            Dynamic routes
-          </nuxt-link>
-        </li>
-        <li class="Navbar__Links__Item">
-          <nuxt-link to="/users" class="Navbar__Links__Item__Link">
-            Nested routes
-          </nuxt-link>
-        </li>
-        <li class="Navbar__Links__Item">
-          <nuxt-link to="/posts" class="Navbar__Links__Item__Link">
-            Dynamic nested routes
-          </nuxt-link>
-        </li>
-      </ul>
-    </nav>
-    <nuxt/>
-  </nuxt-container>
-</template>
-
-<style>
-html, body
-{
-  font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
-  letter-spacing: 0.25px;
-  padding: 0;
-  margin: 0;
-}
-*, *::before, *::after
-{
-  box-sizing: border-box;
-}
-h1, h2, h3, h4, h5, h6 {
-  font-weight: 300;
-  text-align: center;
-}
-.clearfix:before, .clearfix:after
-{
-  content: " ";
-  display: table;
-}
-.clearfix:after
-{
-  clear: both;
-}
-.container {
-  margin: 30px;
-  border: 1px solid #ddd;
-}
-.Navbar
-{
-  background-color: #fff;
-  border-bottom: 1px solid #ddd;
-  margin: 0;
-  padding: 15px 30px;
-}
-.Navbar__Title
-{
-  float: left;
-  font-weight: 300;
-  margin: 0;
-}
-.Navbar__Links
-{
-  float: right;
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-.Navbar__Links__Item
-{
-  float: left;
-  margin: 5px 15px;
-}
-.Navbar__Links__Item__Link
-{
-  color: #000;
-}
-a, a:hover
-{
-  text-transform: uppercase;
-  text-decoration: none;
-  color: #41B883;
-}
-
-.nuxt-link-active {
-  color: #41B883 !important;
-}
-
-.fade-enter-active, .fade-leave-active {
-  transition: opacity .3s;
-}
-.fade-enter, .fade-leave-active {
-  opacity: 0;
-}
-
-.bounce-enter-active {
-  animation: bounce-in .8s;
-}
-.bounce-leave-active {
-  animation: bounce-out .5s;
-}
-@keyframes bounce-in {
-  0% { transform: scale(0) }
-  100% { transform: scale(1) }
-}
-@keyframes bounce-out {
-  0% { transform: scale(1) }
-  100% { transform: scale(0) }
-}
-</style>
diff --git a/examples/custom-routes/nuxt.config.js b/examples/custom-routes/nuxt.config.js
index 712b2977b1..bb0765f744 100644
--- a/examples/custom-routes/nuxt.config.js
+++ b/examples/custom-routes/nuxt.config.js
@@ -1,16 +1,5 @@
 module.exports = {
   build: {
     vendor: ['axios']
-  },
-  generate: {
-    routeParams: {
-      '/users/:id': [{id: 1}, {id: 2}, {id: 3}, {id: 4}, {id: 5}],
-      '/posts/:slug': [{slug: 'foo'}, {slug: 'bar'}],
-      '/posts/:slug/comments': [{slug: 'foo'}, {slug: 'bar'}],
-      '/posts/:slug/:name': [{slug: 'foo', name: 'b'}, {slug: 'bar', name: 'a'}],
-      '/projects/:slug': [{slug: 'toto'}, {slug: 'titi'}, {slug: 'tutu'}]
-    }
-  },
-  transition: 'fade',
-  loading: false
+  }
 }
diff --git a/examples/custom-routes/pages/index.vue b/examples/custom-routes/pages/index.vue
index 99e38858f6..94414546d1 100644
--- a/examples/custom-routes/pages/index.vue
+++ b/examples/custom-routes/pages/index.vue
@@ -1,8 +1,46 @@
 <template>
   <div class="container">
-    <h1>Home</h1>
-    <h2>
-      Examples of custom routes
-    </h2>
+    <h2>Users</h2>
+    <ul class="users">
+      <li v-for="user in users">
+        <nuxt-link :to="'/users/'+user.id">{{ user.name }}</nuxt-link>
+      </li>
+    </ul>
   </div>
 </template>
+
+<script>
+import axios from 'axios'
+
+export default {
+  data () {
+    return axios.get('https://jsonplaceholder.typicode.com/users')
+    .then((res) => {
+      return { users: res.data }
+    })
+  }
+}
+</script>
+
+<style scoped>
+.container {
+  text-align: center;
+  margin-top: 100px;
+  font-family: sans-serif;
+}
+.users {
+  list-style-type: none;
+}
+.users li a {
+  display: inline-block;
+  width: 200px;
+  border: 1px #ddd solid;
+  padding: 10px;
+  text-align: left;
+  color: #222;
+  text-decoration: none;
+}
+.users li a:hover {
+  color: orange;
+}
+</style>
diff --git a/examples/custom-routes/pages/posts.vue b/examples/custom-routes/pages/posts.vue
deleted file mode 100644
index 2740c339b0..0000000000
--- a/examples/custom-routes/pages/posts.vue
+++ /dev/null
@@ -1,6 +0,0 @@
-<template>
-  <div class="container">
-    <h1>Dynamic nested route example</h1>
-    <nuxt-child></nuxt-child>
-  </div>
-</template>
diff --git a/examples/custom-routes/pages/posts/_slug.vue b/examples/custom-routes/pages/posts/_slug.vue
deleted file mode 100644
index 41cc7a75f2..0000000000
--- a/examples/custom-routes/pages/posts/_slug.vue
+++ /dev/null
@@ -1,26 +0,0 @@
-<template>
-  <div class="container">
-    <h2>Post : {{ $route.params.slug }}</h2>
-    <p>
-      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-    </p>
-    <p>
-      <nuxt-link :to="{ name: 'posts-slug-name', params: { name: 'foo'} }">Foo</nuxt-link>
-      <nuxt-link :to="{ name: 'posts-slug-name', params: { name: 'bar'} }">Bar</nuxt-link>
-      <nuxt-link :to="{ name: 'posts-slug-comments' }">Comments</nuxt-link>
-    </p>
-    <nuxt-child :key="$route.params.name"></nuxt-child>
-  </div>
-</template>
-
-<style scoped>
-p
-{
-  text-align: center;
-  padding: 15px 30px;
-}
-a
-{
-  margin: 0 15px;
-}
-</style>
diff --git a/examples/custom-routes/pages/posts/_slug/_name.vue b/examples/custom-routes/pages/posts/_slug/_name.vue
deleted file mode 100644
index 79598d5cdd..0000000000
--- a/examples/custom-routes/pages/posts/_slug/_name.vue
+++ /dev/null
@@ -1,51 +0,0 @@
-<template>
-  <div class="container">
-    <h2>{{ $route.params.name }}</h2>
-    <p>
-      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-    </p>
-  </div>
-</template>
-
-<script>
-export default {
-  transition: {
-    name: 'bounce',
-    // css: true,
-    beforeEnter (el) {
-      console.log('Before enter');
-    },
-    enter (el) {
-      console.log('Enter')
-      // done()
-    },
-    afterEnter (el) {
-      console.log('After enter')
-    },
-    enterCancelled (el) {
-      console.log('Enter cancelled')
-    },
-    beforeLeave (el) {
-      console.log('Before leave')
-    },
-    leave (el) {
-      console.log('Leave')
-      // done()
-    },
-    afterLeave (el) {
-      console.log('After leave')
-    },
-    leaveCancelled (el) {
-      console.log('Leave cancelled')
-    }
-  }
-}
-</script>
-
-<style scoped>
-p
-{
-  text-align: center;
-  padding: 15px 30px;
-}
-</style>
diff --git a/examples/custom-routes/pages/posts/_slug/comments.vue b/examples/custom-routes/pages/posts/_slug/comments.vue
deleted file mode 100644
index 346a217267..0000000000
--- a/examples/custom-routes/pages/posts/_slug/comments.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<template>
-  <div class="container">
-    Comments only
-  </div>
-</template>
-
-<style scoped>
-.container {
-  padding: 20px;
-}
-</style>
diff --git a/examples/custom-routes/pages/posts/index.vue b/examples/custom-routes/pages/posts/index.vue
deleted file mode 100644
index e1aafcac46..0000000000
--- a/examples/custom-routes/pages/posts/index.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<template>
-  <div class="container">
-    <h2>Posts list</h2>
-    <p>
-      <nuxt-link to="/posts/welcome">
-        Welcome post
-      </nuxt-link>
-    </p>
-  </div>
-</template>
-
-<style scoped>
-p
-{
-  text-align: center;
-}
-</style>
diff --git a/examples/custom-routes/pages/projects/_slug.vue b/examples/custom-routes/pages/projects/_slug.vue
deleted file mode 100644
index bc9ae4ecd1..0000000000
--- a/examples/custom-routes/pages/projects/_slug.vue
+++ /dev/null
@@ -1,24 +0,0 @@
-<template>
-  <div class="container">
-    <h1>Dynamic route example</h1>
-    <h2>Project : {{ $route.params.slug }}</h2>
-    <p>
-      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-    </p>
-  </div>
-</template>
-
-<script>
-export default {
-  validate ({ params }) {
-    return /^[A-z]+$/.test(params.slug)
-  }
-}
-</script>
-
-<style scoped>
-p
-{
-  padding: 15px 30px;
-}
-</style>
diff --git a/examples/custom-routes/pages/projects/index.vue b/examples/custom-routes/pages/projects/index.vue
deleted file mode 100644
index 32e21bc91d..0000000000
--- a/examples/custom-routes/pages/projects/index.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<template>
-  <div class="container">
-    <h1>Dynamic route example</h1>
-    <h2>Projects list</h2>
-    <p>
-      <nuxt-link :to="{ name: 'projects-slug', params: { slug: 'nuxtjs'} }">
-        Nuxt.js
-      </nuxt-link>
-    </p>
-  </div>
-</template>
-
-<style scoped>
-p
-{
-  text-align: center;
-}
-</style>
diff --git a/examples/custom-routes/pages/team/index.vue b/examples/custom-routes/pages/team/index.vue
deleted file mode 100644
index 044fe61ee2..0000000000
--- a/examples/custom-routes/pages/team/index.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template>
-  <div class="container">
-    <h1>Team</h1>
-  </div>
-</template>
diff --git a/examples/custom-routes/pages/users.vue b/examples/custom-routes/pages/users.vue
deleted file mode 100644
index e9b2898931..0000000000
--- a/examples/custom-routes/pages/users.vue
+++ /dev/null
@@ -1,46 +0,0 @@
-<template>
-  <div class="container clearfix">
-    <h1>Nested routes example</h1>
-    <h2>Users list</h2>
-    <ul class="users">
-      <li v-for="user in users">
-        <nuxt-link :to="{ name: 'users-id', params: { id: user.id } }">{{ user.name }}</nuxt-link>
-      </li>
-    </ul>
-    <nuxt-child :key="$route.params.id"></nuxt-child>
-  </div>
-</template>
-
-<script>
-import axios from 'axios'
-
-export default {
-  transition: 'bounce',
-  data () {
-    return axios.get('https://jsonplaceholder.typicode.com/users')
-    .then((res) => {
-      return { users: res.data }
-    })
-  }
-}
-</script>
-
-<style scoped>
-.users {
-  margin: 10px 0;
-  float: left;
-  list-style-type: none;
-}
-.users li a {
-  display: inline-block;
-  width: 200px;
-  border: 1px #ddd solid;
-  padding: 10px;
-  text-align: left;
-  color: #222;
-  text-decoration: none;
-}
-.users li a:hover {
-  color: #41b883;
-}
-</style>
diff --git a/examples/custom-routes/pages/users/_id.vue b/examples/custom-routes/pages/users/_id.vue
index 5093e69ff9..ccd6594097 100644
--- a/examples/custom-routes/pages/users/_id.vue
+++ b/examples/custom-routes/pages/users/_id.vue
@@ -1,10 +1,9 @@
 <template>
-  <div class="container">
-    <h2>User</h2>
-    <h3>{{ user.name }}</h3>
-    <h4>@{{ user.username }}</h4>
-    <p>Email : {{ user.email }}</p>
-    <p><nuxt-link to="/users">List of users</nuxt-link></p>
+  <div class="user">
+    <h3>{{ name }}</h3>
+    <h4>@{{ username }}</h4>
+    <p>Email : {{ email }}</p>
+    <p><nuxt-link to="/">List of users</nuxt-link></p>
   </div>
 </template>
 
@@ -12,13 +11,12 @@
 import axios from 'axios'
 
 export default {
-  transition (to, from) {
-    if (!from || !from.params.id || !to.params.id) return 'fade'
-    return +to.params.id > +from.params.id ? 'slide-left' : 'slide-right'
+  validate ({ params }) {
+    return !isNaN(+params.id)
   },
   data ({ params, error }) {
-    return axios.get(`https://jsonplaceholder.typicode.com/users/${params.id}`)
-    .then((res) => { return { user: res.data } })
+    return axios.get(`https://jsonplaceholder.typicode.com/users/${+params.id}`)
+    .then((res) => res.data)
     .catch(() => {
       error({ message: 'User not found', statusCode: 404 })
     })
@@ -27,21 +25,9 @@ export default {
 </script>
 
 <style scoped>
-.container
-{
+.user {
   text-align: center;
-  overflow: hidden;
-  min-height: 440px;
-  transition: all .5s cubic-bezier(.55,0,.1,1);
-}
-.slide-left-enter,
-.slide-right-leave-active {
-  opacity: 0;
-  transform: translate(30px, 0);
-}
-.slide-left-leave-active,
-.slide-right-enter {
-  opacity: 0;
-  transform: translate(-30px, 0);
+  margin-top: 100px;
+  font-family: sans-serif;
 }
 </style>

From 9780bd7b46715cbaf5c1cb572df8098138e75e45 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Mon, 19 Dec 2016 20:36:58 +0100
Subject: [PATCH 42/42] Bump to 0.9.0

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index a5bc1d728f..d6edf78d1b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "nuxt",
-  "version": "0.8.8",
+  "version": "0.9.0",
   "description": "A minimalistic framework for server-rendered Vue.js applications (inspired by Next.js)",
   "contributors": [
     {