Fix layout not declared

This commit is contained in:
Sebastien Chopin 2017-07-27 16:26:36 +02:00
parent dbe4f13a7a
commit 6c6e6e55aa

View File

@ -1,13 +1,13 @@
import Vue from 'vue' import Vue from 'vue'
import middleware from './middleware' import middleware from './middleware'
import { createApp, NuxtError } from './index' import { createApp, NuxtError } from './index'
import { import {
applyAsyncData, applyAsyncData,
sanitizeComponent, sanitizeComponent,
getMatchedComponents, getMatchedComponents,
getMatchedComponentsInstances, getMatchedComponentsInstances,
flatMapComponents, flatMapComponents,
getContext, getContext,
middlewareSeries, middlewareSeries,
promisify, promisify,
getLocation, getLocation,
@ -51,11 +51,11 @@ function mapTransitions(Components, to, from) {
const transition = componentOption(component, 'transition', to, from) const transition = componentOption(component, 'transition', to, from)
return (typeof transition === 'string' ? { name: transition } : transition) return (typeof transition === 'string' ? { name: transition } : transition)
} }
return Components.map(Component => { return Components.map(Component => {
// Clone original object to prevent overrides // Clone original object to prevent overrides
const transitions = Object.assign({}, componentTransitions(Component)) const transitions = Object.assign({}, componentTransitions(Component))
// Combine transitions & prefer `leave` transitions of 'from' route // Combine transitions & prefer `leave` transitions of 'from' route
if (from && from.matched.length && from.matched[0].components.default) { if (from && from.matched.length && from.matched[0].components.default) {
const from_transitions = componentTransitions(from.matched[0].components.default) const from_transitions = componentTransitions(from.matched[0].components.default)
@ -63,7 +63,7 @@ function mapTransitions(Components, to, from) {
.filter(key => from_transitions[key] && key.toLowerCase().indexOf('leave') !== -1) .filter(key => from_transitions[key] && key.toLowerCase().indexOf('leave') !== -1)
.forEach(key => { transitions[key] = from_transitions[key] }) .forEach(key => { transitions[key] = from_transitions[key] })
} }
return transitions return transitions
}) })
} }
@ -73,7 +73,7 @@ async function loadAsyncComponents (to, from, next) {
const fromPath = from.fullPath.split('#')[0] const fromPath = from.fullPath.split('#')[0]
const toPath = to.fullPath.split('#')[0] const toPath = to.fullPath.split('#')[0]
this._hashChanged = fromPath === toPath this._hashChanged = fromPath === toPath
<% if (loading) { %> <% if (loading) { %>
if (!this._hashChanged && this.$loading.start) { if (!this._hashChanged && this.$loading.start) {
this.$loading.start() this.$loading.start()
@ -109,9 +109,9 @@ async function loadAsyncComponents (to, from, next) {
// Get matched components // Get matched components
function resolveComponents(router) { function resolveComponents(router) {
const path = getLocation(router.options.base) const path = getLocation(router.options.base)
return flatMapComponents(router.match(path), (Component, _, match, key, index) => { return flatMapComponents(router.match(path), (Component, _, match, key, index) => {
// If component already resolved // If component already resolved
if (typeof Component !== 'function' || Component.options) { if (typeof Component !== 'function' || Component.options) {
const _Component = sanitizeComponent(Component) const _Component = sanitizeComponent(Component)
match.components[key] = _Component match.components[key] = _Component
@ -137,7 +137,7 @@ function resolveComponents(router) {
function callMiddleware (Components, context, layout) { function callMiddleware (Components, context, layout) {
let midd = <%= serialize(router.middleware, { isJSON: true }) %> let midd = <%= serialize(router.middleware, { isJSON: true }) %>
let unknownMiddleware = false let unknownMiddleware = false
// If layout is undefined, only call global middleware // If layout is undefined, only call global middleware
if (typeof layout !== 'undefined') { if (typeof layout !== 'undefined') {
midd = [] // Exclude global middleware if layout defined (already called before) midd = [] // Exclude global middleware if layout defined (already called before)
@ -158,8 +158,8 @@ function callMiddleware (Components, context, layout) {
} }
return middleware[name] return middleware[name]
}) })
if (unknownMiddleware) return if (unknownMiddleware) return
return middlewareSeries(midd, context) return middlewareSeries(midd, context)
} }
@ -174,9 +174,9 @@ async function render (to, from, next) {
nextCalled = true nextCalled = true
next(path) next(path)
} }
// Update context // Update context
const context = getContext({ const context = getContext({
to, to,
from, from,
<% if (store) { %>store,<% } %> <% if (store) { %>store,<% } %>
@ -197,16 +197,16 @@ async function render (to, from, next) {
// Default layout // Default layout
await callMiddleware.call(this, Components, context) await callMiddleware.call(this, Components, context)
if (context._redirected) return if (context._redirected) return
// Load layout for error page // Load layout for error page
layout = await this.loadLayout(typeof NuxtError.layout === 'function' ? NuxtError.layout(context) : NuxtError.layout) const layout = await this.loadLayout(typeof NuxtError.layout === 'function' ? NuxtError.layout(context) : NuxtError.layout)
await callMiddleware.call(this, Components, context, layout) await callMiddleware.call(this, Components, context, layout)
if (context._redirected) return if (context._redirected) return
this.error({ statusCode: 404, message: 'This page could not be found.' }) this.error({ statusCode: 404, message: 'This page could not be found.' })
return next() return next()
} }
// Update ._data and other properties if hot reloaded // Update ._data and other properties if hot reloaded
Components.forEach(Component => { Components.forEach(Component => {
if (Component._Ctor && Component._Ctor.options) { if (Component._Ctor && Component._Ctor.options) {
@ -233,7 +233,7 @@ async function render (to, from, next) {
// Call middleware for layout // Call middleware for layout
await callMiddleware.call(this, Components, context, layout) await callMiddleware.call(this, Components, context, layout)
if (context._redirected) return if (context._redirected) return
// Call .validate() // Call .validate()
let isValid = true let isValid = true
Components.forEach(Component => { Components.forEach(Component => {
@ -250,7 +250,7 @@ async function render (to, from, next) {
this.error({ statusCode: 404, message: 'This page could not be found.' }) this.error({ statusCode: 404, message: 'This page could not be found.' })
return next() return next()
} }
// Call asyncData & fetch hooks on components matched by the route. // Call asyncData & fetch hooks on components matched by the route.
await Promise.all(Components.map((Component, i) => { await Promise.all(Components.map((Component, i) => {
// Check if only children route changed // Check if only children route changed
@ -263,7 +263,7 @@ async function render (to, from, next) {
const hasAsyncData = Component.options.asyncData && typeof Component.options.asyncData === 'function' const hasAsyncData = Component.options.asyncData && typeof Component.options.asyncData === 'function'
const hasFetch = !!Component.options.fetch const hasFetch = !!Component.options.fetch
<% if(loading) { %>const loadingIncrease = (hasAsyncData && hasFetch) ? 30 : 45<% } %> <% if(loading) { %>const loadingIncrease = (hasAsyncData && hasFetch) ? 30 : 45<% } %>
// Call asyncData(context) // Call asyncData(context)
if (hasAsyncData) { if (hasAsyncData) {
@ -279,7 +279,7 @@ async function render (to, from, next) {
if (hasFetch) { if (hasFetch) {
let p = Component.options.fetch(context) let p = Component.options.fetch(context)
if (!p || (!(p instanceof Promise) && (typeof p.then !== 'function'))) { if (!p || (!(p instanceof Promise) && (typeof p.then !== 'function'))) {
p = Promise.resolve(p) p = Promise.resolve(p)
} }
p.then(fetchResult => { p.then(fetchResult => {
<% if(loading) { %>if(this.$loading.increase) this.$loading.increase(loadingIncrease)<% } %> <% if(loading) { %>if(this.$loading.increase) this.$loading.increase(loadingIncrease)<% } %>
@ -289,7 +289,7 @@ async function render (to, from, next) {
return Promise.all(promises) return Promise.all(promises)
})) }))
_lastPaths = Components.map((Component, i) => compile(to.matched[i].path)(to.params)) _lastPaths = Components.map((Component, i) => compile(to.matched[i].path)(to.params))
<% if(loading) { %>if(this.$loading.finish) this.$loading.finish()<% } %> <% if(loading) { %>if(this.$loading.finish) this.$loading.finish()<% } %>
@ -308,7 +308,7 @@ async function render (to, from, next) {
layout = layout(context) layout = layout(context)
} }
await this.loadLayout(layout) await this.loadLayout(layout)
this.error(error) this.error(error)
next(false) next(false)
} }
@ -387,10 +387,10 @@ function nuxtReady (app) {
// Special hot reload with asyncData(context) // Special hot reload with asyncData(context)
function hotReloadAPI (_app) { function hotReloadAPI (_app) {
if (!module.hot) return if (!module.hot) return
let $components = [] let $components = []
let $nuxt = _app.$nuxt let $nuxt = _app.$nuxt
while ($nuxt && $nuxt.$children && $nuxt.$children.length) { while ($nuxt && $nuxt.$children && $nuxt.$children.length) {
$nuxt.$children.forEach((child, i) => { $nuxt.$children.forEach((child, i) => {
if (child.$vnode.data.nuxtChild) { if (child.$vnode.data.nuxtChild) {
@ -407,7 +407,7 @@ function hotReloadAPI (_app) {
$nuxt = child $nuxt = child
}) })
} }
$components.forEach(addHotReload.bind(_app)) $components.forEach(addHotReload.bind(_app))
} }
@ -517,7 +517,7 @@ async function mountApp(__app) {
_lastPaths = router.currentRoute.matched.map(route => compile(route.path)(router.currentRoute.params)) _lastPaths = router.currentRoute.matched.map(route => compile(route.path)(router.currentRoute.params))
_lastComponentsFiles = Components.map(Component => Component.options.__file) _lastComponentsFiles = Components.map(Component => Component.options.__file)
} }
// Initialize error handler // Initialize error handler
_app.error = _app.$options._nuxt.error.bind(_app) _app.error = _app.$options._nuxt.error.bind(_app)
_app.$loading = {} // To avoid error while _app.$nuxt does not exist _app.$loading = {} // To avoid error while _app.$nuxt does not exist
@ -528,7 +528,7 @@ async function mountApp(__app) {
router.beforeEach(render.bind(_app)) router.beforeEach(render.bind(_app))
router.afterEach(normalizeComponents) router.afterEach(normalizeComponents)
router.afterEach(fixPrepatch.bind(_app)) router.afterEach(fixPrepatch.bind(_app))
// If page already is server rendered // If page already is server rendered
if (NUXT.serverRendered) { if (NUXT.serverRendered) {
mountApp() mountApp()
@ -552,4 +552,4 @@ async function mountApp(__app) {
}) })
router.push(path) router.push(path)
}) })
} }