From edd0227e746c2ecde781915bd8c59e98f399439a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= <seb@chopin.io>
Date: Mon, 21 Nov 2016 14:14:35 +0100
Subject: [PATCH] Add pages/_app.vue possibility + example

---
 examples/extend-app/README.md                 |  42 +++++++++++++++
 examples/extend-app/package.json              |  11 ++++
 examples/extend-app/pages/_app.vue            |  15 ++++++
 examples/extend-app/pages/about.vue           |  16 ++++++
 examples/extend-app/pages/index.vue           |   6 +++
 examples/extend-app/static/logo.png           | Bin 0 -> 2089 bytes
 .../components/twitter-head-card.vue          |   2 +-
 lib/app/App-new.vue                           |   5 --
 lib/app/App.vue                               |  50 ++----------------
 lib/app/client.js                             |  29 ++++++----
 lib/app/components/nuxt-error-debug.vue       |   1 +
 lib/app/components/nuxt-error.vue             |   1 +
 lib/app/components/nuxt-loading.vue           |   3 +-
 lib/app/components/nuxt.vue                   |  40 ++++++--------
 lib/app/index.js                              |  19 +++++--
 lib/app/server.js                             |  10 ++--
 lib/app/utils.js                              |   7 +--
 lib/build/index.js                            |   5 +-
 package.json                                  |   2 +-
 19 files changed, 159 insertions(+), 105 deletions(-)
 create mode 100644 examples/extend-app/README.md
 create mode 100644 examples/extend-app/package.json
 create mode 100644 examples/extend-app/pages/_app.vue
 create mode 100644 examples/extend-app/pages/about.vue
 create mode 100644 examples/extend-app/pages/index.vue
 create mode 100644 examples/extend-app/static/logo.png
 delete mode 100644 lib/app/App-new.vue

diff --git a/examples/extend-app/README.md b/examples/extend-app/README.md
new file mode 100644
index 0000000000..e1f3805bbe
--- /dev/null
+++ b/examples/extend-app/README.md
@@ -0,0 +1,42 @@
+# Extending the main app
+
+> Nuxt.js allows you to extend the main application by adding a `pages/_app.vue` file
+
+## The default app
+
+The default source code of the main app is:
+```html
+<template>
+  <nuxt-container>
+    <nuxt/>
+  </nuxt-container>
+</template>
+```
+
+## The `pages/_app.vue` file
+
+### 🎬 [Example video](https://www.youtube.com/watch?v=wBhia7uBxDA)
+
+You have to make sure to add the `<nuxt-container>` and `<nuxt>` components when extending the app.
+
+It is important that the code you add stays inside `<nuxt-container>`.
+
+Example:
+```html
+<template>
+  <nuxt-container>
+    <div>My navigation bar here</div>
+    <nuxt/>
+  </nuxt-container>
+</template>
+```
+
+## Demo
+
+
+```bash
+npm install
+npm start
+```
+
+Go to [http://localhost:3000](http://localhost:3000) and navigate trough the app. Notice how the logo at the top right stays between the pages, even on the error page: [http://localhost:3000/404](http://localhost:3000/404)
diff --git a/examples/extend-app/package.json b/examples/extend-app/package.json
new file mode 100644
index 0000000000..ce5d6af2a6
--- /dev/null
+++ b/examples/extend-app/package.json
@@ -0,0 +1,11 @@
+{
+  "name": "nuxt-extend-app",
+  "dependencies": {
+    "nuxt": "latest"
+  },
+  "scripts": {
+    "dev": "nuxt",
+    "build": "nuxt build",
+    "start": "nuxt start"
+  }
+}
diff --git a/examples/extend-app/pages/_app.vue b/examples/extend-app/pages/_app.vue
new file mode 100644
index 0000000000..a07eda60e8
--- /dev/null
+++ b/examples/extend-app/pages/_app.vue
@@ -0,0 +1,15 @@
+<template>
+  <nuxt-container>
+    <img src="logo.png"/>
+    <nuxt/>
+  </nuxt-container>
+</template>
+
+<style scoped>
+img {
+  position: fixed;
+  top: 20px;
+  right: 20px;
+  z-index: 1000;
+}
+</style>
diff --git a/examples/extend-app/pages/about.vue b/examples/extend-app/pages/about.vue
new file mode 100644
index 0000000000..cb9849695c
--- /dev/null
+++ b/examples/extend-app/pages/about.vue
@@ -0,0 +1,16 @@
+<template>
+  <div>
+    <p>Hi from {{ name }}</p>
+    <router-link to="/">Home page</router-link>
+  </div>
+</template>
+
+<script>
+export default {
+  data ({ req }) {
+    return {
+      name: req ? 'server' : 'client'
+    }
+  }
+}
+</script>
diff --git a/examples/extend-app/pages/index.vue b/examples/extend-app/pages/index.vue
new file mode 100644
index 0000000000..14713d2a05
--- /dev/null
+++ b/examples/extend-app/pages/index.vue
@@ -0,0 +1,6 @@
+<template>
+  <div class="container">
+    <h1>Welcome!</h1>
+    <router-link to="/about">About page</router-link>
+  </div>
+</template>
diff --git a/examples/extend-app/static/logo.png b/examples/extend-app/static/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..9d716abf2216134ba4ddb8f24108120beb4b8660
GIT binary patch
literal 2089
zcmV+^2-f$BP)<h;3K|Lk000e1NJLTq003qH002q|1^@s6NwFa>00004XF*Lt006O%
z3;baP000NzNkl<ZcmeI43$RU97{@)YLJ^V3bVYZXkVljv#v@IWL@&uq-MI{5JSLT*
zhL|Re3MGS57?lzlsYxi4q6{OC$#|seIm)DFn#!o?_t!n<IJ2MYoO|}(=j?ChH)rp)
zzHhB>eQWQv*IIkuTcJX9q&KdLSV9zm%kbqV*bWs#<X5@5Qn}np&TPR;C~gH@0ViPx
z#1e1>Mo|AZPzAccK8VT%g{!$K*V3$?p=na{R&hKe={!Enas;YU-&QC|ska^HhoM?Z
zy4|TdwZC0vobEpYQ!!a)W44s^F*bS0$!$0}0>41F<c#>(ECO9IQ$Xw5m}`jBEUl(Z
zzLHgjbozjvO*$@uSPUaj8@q$h)5U%P`4en(?j>Cv(K#u9Aji8w<;P+Wf%mYP=E1HB
zIvS$tr05RiT+g6ZDd{@Z@VFM@S)HQcLmom`YZR{!_Seu=uoI#?XfLSKtfUf&S`W>(
z%8b*jBcNbvYTVK~+cNcXQgzofhFP!$>VuQ$xwH*NJ1NC^|3^Sq@>gIItSQ*3L)XAX
z;6<)PNt27)y(s6i&NDQAHB>YRf}Sz2LxE4*o6uK>Huq_lH|jUgQq7<m2GHUG)VUw*
zrsV;+6pkvZ<HjDiCqQ>5Q}=q%PD3nZ5zr7cFW_is_*??>1NI{{)%U>@?G!t$-m~Sb
z?%d7rWVR{{YdsBc>=<+ik%M~1X<@1hCU50aT5h+U5@b-Wr*h5IS_kPwP<4-_;*Aj2
zZ4pgGv{$Fs*?A*cGaQGjLf+!>`1dV%-5LscbDZ7N0#I8a#m;J>$z6mei$mj0IXdzZ
zWq(kP<!8ER-7OnnVx|iYQ+eHS<`ATA(TB-LD_^uBS_=KFGNYb$2@O!E^oVFfTH?2!
zi`qKMDbcE0!&sE17tU)px>1xHk?eahCwk!L!t7=Y?a)^{+9imzXiBWbT8l`x;(X`d
z;B@)<Nzppfi!aS+Mn%hQS8ufgy$<wpE|Q|{mQ`T#;w$V8u8V`(e0@0Vj;8u|BMI7|
z)cg2cm1}62hUrdGX<!W;)z#EDDh{XN=dIWt1${&kdeKWSz5L1-8BRlYg4d5g0*TAr
z)VddR*W{DTq_LlXCOn}NJx}yp$+^|Bhe%gOM-!dt9(1#=@)<Si6Qq2VS~PqY3<*;J
zM&r!aperYzr74ZqsL?G9LC^-@NjMX8E(RxvMG?djM<9+s9Dz6jaRlNB#1V)i5Jw=6
zKpcTM0&xU_kAU7V>b=71G+k+o{crHQOF0GP>*dntE_z<GJEB+$M;r|F#<2~oanSLS
zrEeIj!fqR7wQW3PVt0K}6$;Xq_g&#jFqIMvwNEt1rGRGSKMk4cm`5l}Uw1ln%xUuF
zS0C5`CZaE6J_79v+I7q+^1cJ7j?srH-C+he$uV`z0eBPI!>?c>y7MZT7-qpnZ5j;k
zfL=@d1%5?=)DF7a$g<p}V14vh1dCks&IVK4)w-hQx+zCEe=WYRgy{xtxF4IgFxJ4<
z*d%e4zeowSVUTf2;WyO#qE?{)Gvig7p!hQM2MtwO6Afh&ZQJW}oDHxZ?8Z^DA}jyk
zxdQwJY=VQ}B#MoOzj3g~NwGZg5_gQsJ_`D4FF8{HxhOx<sHZ?}bbGNk8J&Hw5V9`G
z9iz%uz(#mpCpjwb(k|Tr6CB#tgFJm)GR#4zT(eR;MwLAVTHEy0Nsh`0+NEbr7mN1Q
zCv6@K0Jn9Sg?VO@tU5-oisjTCsF#^)LRZQkc%(LJnV<z|LNx7P0Gb|eP9z5LYt=FG
zLklteP0L$4$x+!#yIuv|9SM1qgEKHKkr33cUB}3unII=MA;?wHouO?OeNovC)Yf89
zy91TPblJ{{5;F8>)$3q8<eI1hia~9Z3<P~F9=JH&F>>xW41u@dLdZo?8`UwoNH>I~
zfo>fmKea!kjZQsta#8N1QH|hzcqJ?i^wKf%bv$ST@GhOCAsRZo*6F1hm8IQdQz^vo
z1<(vl3r~H(*bf31uR+p2(Sx9eWy3VQF2%Mm4f|Bnt4a7FHPPdFV#`JAwnOkYXv=0Q
zXpbyV@!BzRQmf@jun_#%p?*%Z<*qfvrRP%24;0vDu-mYRXR+G`%aZK(bNmD>2F=z2
z6Tbo0g6sr5o`%PInbbNB`-Ew84s@~nn@I5S+YQ}bpmj^Cs8e>rbEz5GJono%@@+5-
z0?qqPL^Gh?CWa|Cdfurlzfuo_xuEBY?qDm?mdzb-n^k7E(mpn*=oV~tLCrGTiTn;N
zJ9hiI00mu<o!k^1@~<QBFlb-Pk5oi?CFqs3o3ujV05ot@^pW2K-Q=Ou*3{&VQDN&r
z(@Sk>_!aHNm4LQFYWOuqzW^4(DDb-&l+7ua4Q`_6k0t`DOC6e3G3^*RISGp30iF1i
zP3SKHjpxamh;GGPjKTuY9k<j?IVHa>=fgp(d#^GR#Xn)JSA$IInG9u#`U^QIh56uh
zC`0wE=%P@AOW{s%lddRe)}*Ug!=WG1ko!Go2=*&=Fi^c6{2E&5dmhSUn@-2bUUUD`
z;J0IBD`^2+;6oS*H$!!(2JK-O=+4p%tRtAne2gZT7?#;|=2vesYo$?!Onr6CtTZc=
zxytCBMmbtD^o7ZwhqE5KdbqEGDbNqpStg?4R^?PSF;21>$FVMwbfhK5p5px<<4tp{
TWz)6e00000NkvXXu0mjf@SEx3

literal 0
HcmV?d00001

diff --git a/examples/head-elements/components/twitter-head-card.vue b/examples/head-elements/components/twitter-head-card.vue
index a998a84620..54391ee10b 100644
--- a/examples/head-elements/components/twitter-head-card.vue
+++ b/examples/head-elements/components/twitter-head-card.vue
@@ -3,7 +3,7 @@
 </template>
 
 <script>
-// https://cards-dev.twitter.com/validator
+// Test on: https://cards-dev.twitter.com/validator
 export default {
   data: () => ({
     href: 'https://twitter.com/intent/tweet?url=' + encodeURIComponent('https://head-elements.now.sh/about')
diff --git a/lib/app/App-new.vue b/lib/app/App-new.vue
deleted file mode 100644
index 6f2c12117d..0000000000
--- a/lib/app/App-new.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template>
-  <nuxt-container>
-    <nuxt></nuxt>
-  </nuxt-container>
-</template>
diff --git a/lib/app/App.vue b/lib/app/App.vue
index 56ce0d5692..25fab4ce30 100644
--- a/lib/app/App.vue
+++ b/lib/app/App.vue
@@ -1,49 +1,5 @@
 <template>
-  <div id="__nuxt">
-    <% if (loading) { %><nuxt-loading ref="loading"></nuxt-loading><% } %>
-    <router-view v-if="!err"></router-view>
-    <nuxt-error v-if="err" :error="err"></nuxt-error>
-  </div>
+  <nuxt-container>
+    <nuxt/>
+  </nuxt-container>
 </template>
-
-<script>
-import NuxtError from '<%= components.ErrorPage %>'
-<% if (loading) { %>import NuxtLoading from '<%= (typeof loading === "string" ? loading : "./components/nuxt-loading.vue") %>'<% } %>
-
-export default {
-  data () {
-    return {
-      err: null
-    }
-  },
-  <% if (loading) { %>
-  created () {
-    this.$loading = {} // for NUXT.serverRendered = false
-  },
-  mounted () {
-    this.$loading = this.$refs.loading
-  },
-  <% } %>
-  methods: {
-    error (err) {
-      err = err || null
-      this.err = err || null
-      <% if (loading) { %>
-      if (this.err && this.$loading) {
-        if (this.$loading.fail) this.$loading.fail()
-        if (this.$loading.finish) this.$loading.finish()
-      }
-      <% } %>
-      return this.err
-    }
-  },
-  components: {
-    NuxtError<%= (loading ? ',\n\t\tNuxtLoading' : '') %>
-  },
-  head: <%= JSON.stringify(head) %>
-}
-</script>
-
-<% css.forEach(function (c) { %>
-<style src="<%= (typeof c === 'string' ? c : c.src) %>" lang="<%= (c.lang ? c.lang : 'css') %>"></style>
-<% }) %>
diff --git a/lib/app/client.js b/lib/app/client.js
index 47e24ef54f..3af45382ce 100644
--- a/lib/app/client.js
+++ b/lib/app/client.js
@@ -112,8 +112,9 @@ function render (to, ___, next) {
 
 // Special hot reload with data(context)
 function hotReloadAPI (_app) {
-  var _forceUpdate = _app.$forceUpdate.bind(_app)
-  _app.$forceUpdate = function () {
+  const $nuxt = _app.$nuxt
+  var _forceUpdate = $nuxt.$forceUpdate.bind($nuxt)
+  $nuxt.$forceUpdate = function () {
     let Component = getMatchedComponents(router.currentRoute)[0]
     if (!Component) return _forceUpdate()
     if (typeof Component === 'object' && !Component.options) {
@@ -127,7 +128,7 @@ function hotReloadAPI (_app) {
       <%= (loading ? 'this.$loading.finish && this.$loading.finish()' : '') %>
       router.push(path)
     }
-    const context = getContext({ route: router.currentRoute<%= (store ? ', store' : '') %>, isClient: true, next: next.bind(this), error: _app.error.bind(_app) })
+    const context = getContext({ route: router.currentRoute<%= (store ? ', store' : '') %>, isClient: true, next: next.bind(this), error: _app.error })
     // Check if data has been updated
     const originalDataFn = (Component._data || noopData).toString().replace(/\s/g, '')
     const newDataFn = (Component._Ctor.options.data || noopData).toString().replace(/\s/g, '')
@@ -206,17 +207,27 @@ const resolveComponents = flatMapComponents(router.match(path), (Component, _, m
 Promise.all(resolveComponents)
 .then((Components) => {
   const _app = new Vue(app)
-  const mountApp = () => _app.$mount('#__nuxt')
-  const onNuxtReady = window.onNuxtReady || function () {}
+  const mountApp = () => {
+    _app.$mount('#__nuxt')
+    <% if (loading) { %>
+    // Special loading bar
+    _app.$loading = _app.$nuxt.$loading
+    <% } %>
+    // Hot reloading
+    if (module.hot) hotReloadAPI(_app)
+    // Useful for jsdom testing or plugins (https://github.com/tmpvar/jsdom#dealing-with-asynchronous-script-loading)
+    if (typeof window.onNuxtReady === 'function') {
+      window.onNuxtReady(_app)
+    }
+  }
+  _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)
-  if (module.hot) hotReloadAPI(_app)
   // Add router hooks
   router.beforeEach(loadAsyncComponents.bind(_app))
   router.beforeEach(render.bind(_app))
   if (NUXT.serverRendered) {
     mountApp()
-    // Call window.onModulesLoaded for jsdom testing (https://github.com/tmpvar/jsdom#dealing-with-asynchronous-script-loading)
-    onNuxtReady(_app)
     return
   }
   render.call(_app, router.currentRoute, router.currentRoute, function (path) {
@@ -226,13 +237,11 @@ Promise.all(resolveComponents)
         if (mounted) return
         mounted = true
         mountApp()
-        onNuxtReady(_app)
       })
       router.push(path)
       return
     }
     mountApp()
-    onNuxtReady(_app)
   })
 })
 .catch((err) => {
diff --git a/lib/app/components/nuxt-error-debug.vue b/lib/app/components/nuxt-error-debug.vue
index 542d203636..d84133ef72 100755
--- a/lib/app/components/nuxt-error-debug.vue
+++ b/lib/app/components/nuxt-error-debug.vue
@@ -13,6 +13,7 @@
 
 <script>
 export default {
+  name: 'nuxt-error',
   props: ['error'],
   head () {
     return {
diff --git a/lib/app/components/nuxt-error.vue b/lib/app/components/nuxt-error.vue
index fc3acff987..dbee65a48c 100644
--- a/lib/app/components/nuxt-error.vue
+++ b/lib/app/components/nuxt-error.vue
@@ -12,6 +12,7 @@
 
 <script>
 export default {
+  name: 'nuxt-error',
   props: ['error'],
   head () {
     return {
diff --git a/lib/app/components/nuxt-loading.vue b/lib/app/components/nuxt-loading.vue
index 9351b1c709..f7d0e91cae 100644
--- a/lib/app/components/nuxt-loading.vue
+++ b/lib/app/components/nuxt-loading.vue
@@ -8,9 +8,10 @@
 </template>
 
 <script>
-const Vue = require('vue')
+import Vue from 'vue'
 
 export default {
+  name: 'nuxt-loading',
   data () {
     return {
       percent: 0,
diff --git a/lib/app/components/nuxt.vue b/lib/app/components/nuxt.vue
index 3e7e95f9a9..20ba58d00f 100644
--- a/lib/app/components/nuxt.vue
+++ b/lib/app/components/nuxt.vue
@@ -1,57 +1,49 @@
 <template>
   <div>
     <% if (loading) { %><nuxt-loading ref="loading"></nuxt-loading><% } %>
-    <transition>
-      <router-view v-if="!err"></router-view>
-      <nuxt-error v-if="err" :error="err"></nuxt-error>
+    <transition mode="out-in">
+      <router-view v-if="!nuxt.err"></router-view>
+      <nuxt-error v-if="nuxt.err" :error="nuxt.err"></nuxt-error>
     </transition>
   </div>
 </template>
 
 <script>
+import Vue from 'vue'
 import NuxtError from '<%= components.ErrorPage %>'
 <% if (loading) { %>import NuxtLoading from '<%= (typeof loading === "string" ? loading : "./nuxt-loading.vue") %>'<% } %>
 
 export default {
   name: 'nuxt',
-  data () {
-    return {
-      err: null
-    }
+  beforeCreate () {
+    Vue.util.defineReactive(this, 'nuxt', this.$root.$options._nuxt)
   },
-  <% if (loading) { %>
   created () {
-    if (this.$root.$nuxt) {
-      return console.error('Only one instance of Nuxt.js is possible, make sure to use <nuxt></nuxt> only once.')
-    }
-    // Add $nuxt in the root instance
-    this.$root.$nuxt = this
-    // add vm.$nuxt to child instances
+    // Add this.$nuxt in child instances
     Vue.prototype.$nuxt = this
+    // Add this.$root.$nuxt
+    this.$root.$nuxt = this
     // add to window so we can listen when ready
     if (typeof window !== 'undefined') {
       window.$nuxt = this
     }
-    // for NUXT.serverRendered = false
-    this.$loading = {}
   },
+  <% if (loading) { %>
   mounted () {
     this.$loading = this.$refs.loading
   },
-  <% } %>
+  watch: {
+    'nuxt.err': 'errorChanged'
+  },
   methods: {
-    error (err) {
-      err = err || null
-      this.err = err || null
-      <% if (loading) { %>
-      if (this.err && this.$loading) {
+    errorChanged () {
+      if (this.nuxt.err && this.$loading) {
         if (this.$loading.fail) this.$loading.fail()
         if (this.$loading.finish) this.$loading.finish()
       }
-      <% } %>
-      return this.err
     }
   },
+  <% } %>
   components: {
     NuxtError<%= (loading ? ',\n\t\tNuxtLoading' : '') %>
   }
diff --git a/lib/app/index.js b/lib/app/index.js
index 23adbea7a0..d8cc7c9b41 100644
--- a/lib/app/index.js
+++ b/lib/app/index.js
@@ -1,18 +1,19 @@
 'use strict'
 
-// The Vue build version to load with the `import` command
-// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
 import Vue from 'vue'
 import Meta from 'vue-meta/lib/vue-meta.js' // require the ES2015 lib
 import router from './router.js'
 <% if (store) { %>import store from '~store/index.js'<% } %>
-
 import NuxtContainer from './components/nuxt-container.vue'
 import Nuxt from './components/nuxt.vue'
+import App from '<%= appPath %>'
 
+// Component: <nuxt-container>
 Vue.component(NuxtContainer.name, NuxtContainer)
+// Component: <nuxt>
 Vue.component(Nuxt.name, Nuxt)
 
+// vue-meta configuration
 Vue.use(Meta, {
   keyName: 'head', // the component option name that vue-meta looks for meta info on.
   attribute: 'n-head', // the attribute name vue-meta adds to the tags it observes
@@ -20,17 +21,25 @@ Vue.use(Meta, {
   tagIDKeyName: 'hid' // the property name that vue-meta uses to determine whether to overwrite or append a tag
 })
 
+// Includes external plugins
 <% plugins.forEach(function (pluginPath) { %>
 require('<%= pluginPath %>')
 <% }) %>
 
-import App from '<%= appPath %>'
-// create the app instance.
+// root instance
 // here we inject the router and store to all child components,
 // making them available everywhere as `this.$router` and `this.$store`.
 const app = {
   router,
   <%= (store ? 'store,' : '') %>
+  _nuxt: {
+    err: null,
+    error (err) {
+      err = err || null
+      this.$options._nuxt.err = err;
+      return err
+    }
+  },
   ...App
 }
 
diff --git a/lib/app/server.js b/lib/app/server.js
index 7ee6f384a6..76dbf8ae40 100644
--- a/lib/app/server.js
+++ b/lib/app/server.js
@@ -10,7 +10,7 @@ import { getMatchedComponents, getContext, promisify, urlJoin } from './utils'
 const isDev = <%= isDev %>
 const _app = new Vue(app)
 
-// Fix issue from vue-router Abstract mode with base (use for server-side rendering)
+// Fix issue from vue-router Abstract mode with base (used for server-side rendering)
 router.history.base = '<%= router.base %>'
 
 // This exported function will be called by `bundleRenderer`.
@@ -46,7 +46,7 @@ export default context => {
   // Add meta infos
   context.meta = _app.$meta()
   // Error function
-  context.error = _app.error.bind(_app)
+  context.error = _app.$options._nuxt.error.bind(_app)
 
   <%= (isDev ? 'const s = isDev && Date.now()' : '') %>
   let Components = getMatchedComponents(context.route)
@@ -88,7 +88,7 @@ export default context => {
   })
   .then((res) => {
     if (!Components.length) {
-      context.nuxt.error = _app.error({ statusCode: 404, message: 'This page could not be found.', url: context.route.path })
+      context.nuxt.error = context.error({ statusCode: 404, message: 'This page could not be found.', url: context.route.path })
       <%= (store ? 'context.nuxt.state = store.state' : '') %>
       return _app
     }
@@ -97,13 +97,13 @@ export default context => {
     <% } %>
     // datas are the first row of each
     context.nuxt.data = res.map((tab) => tab[0])
-    context.nuxt.error = _app.err
+    context.nuxt.error = _app.$options._nuxt.err
     <%= (store ? '// Add the state from the vuex store' : '') %>
     <%= (store ? 'context.nuxt.state = store.state' : '') %>
     return _app
   })
   .catch(function (error) {
-    context.nuxt.error = _app.error(error)
+    context.nuxt.error = context.error(error)
     <%= (store ? 'context.nuxt.state = store.state' : '') %>
     return _app
   })
diff --git a/lib/app/utils.js b/lib/app/utils.js
index a017a0238b..c4cdbfdd8c 100644
--- a/lib/app/utils.js
+++ b/lib/app/utils.js
@@ -25,6 +25,7 @@ export function getContext (context) {
     route: (context.to ? context.to : context.route),
     error: context.error
   }
+  const next = context.next
   ctx.params = ctx.route.params || {}
   ctx.query = ctx.route.query || {}
   ctx.redirect = function (status, path, query) {
@@ -35,7 +36,7 @@ export function getContext (context) {
       path = status
       status = 302
     }
-    context.next({
+    next({
       path: path,
       query: query,
       status: status
@@ -51,7 +52,7 @@ export function promisify (fn, context) {
   if (fn.length === 2) {
     // fn(context, callback)
     promise = new Promise((resolve) => {
-      fn(getContext(context), function (err, data) {
+      fn(context, function (err, data) {
         if (err) {
           context.error(err)
         }
@@ -60,7 +61,7 @@ export function promisify (fn, context) {
       })
     })
   } else {
-    promise = fn(getContext(context))
+    promise = fn(context)
   }
   if (!(promise instanceof Promise)) {
     promise = Promise.resolve(promise)
diff --git a/lib/build/index.js b/lib/build/index.js
index 9eebb686c3..3ae5b07da8 100644
--- a/lib/build/index.js
+++ b/lib/build/index.js
@@ -27,10 +27,10 @@ const wp = function (p) {
 }
 const r = function () {
   let args = Array.from(arguments)
-  args = args.map(normalize)
   if (_.last(args).includes('~')) {
     return wp(_.last(args))
   }
+  args = args.map(normalize)
   return wp(resolve.apply(null, args))
 }
 
@@ -184,7 +184,6 @@ function * generateRoutesAndFiles () {
     templateVars.loading = templateVars.loading + '.vue'
   }
   // Format routes for the lib/app/router.js template
-  // TODO: check .children
   templateVars.router.routes.forEach((route) => {
     route._component = route.component
     route._name = '_' + hash(route._component)
@@ -308,7 +307,7 @@ function createRenderer (bundle) {
 function watchPages () {
   const patterns = [ r(this.dir, 'pages/*.vue'), r(this.dir, 'pages/**/*.vue') ]
   const options = {
-    ignored: '**/_*.vue',
+    // ignored: '**/_*.vue',
     ignoreInitial: true
   }
   const refreshFiles = _.debounce(() => {
diff --git a/package.json b/package.json
index e69bc6e7f6..a95343353e 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "nuxt",
-  "version": "0.5.3",
+  "version": "0.6.0",
   "description": "A minimalistic framework for server-rendered Vue.js applications (inspired by Next.js)",
   "main": "index.js",
   "license": "MIT",