fix(nuxt): throw an error when using unknown route middleware (#5323)

This commit is contained in:
Daniel Roe 2022-06-10 14:35:58 +01:00 committed by GitHub
parent 846be5cee2
commit f6bf4f7559
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 7 additions and 4 deletions

View File

@ -8,7 +8,7 @@ head.title: Layouts directory
Nuxt provides a customizable layouts framework you can use throughout your application, ideal for extracting common UI or code patterns into reusable layout components. Nuxt provides a customizable layouts framework you can use throughout your application, ideal for extracting common UI or code patterns into reusable layout components.
Layouts are placed in the `layouts/` directory and will be automatically loaded via asynchronous import when used. Layouts are used by setting a `layout` property as part of your page metadata (if you are using the `~/pages` integration), or by using the `<NuxtLayout>` component. Layouts are placed in the `layouts/` directory and will be automatically loaded via asynchronous import when used. Layouts are used by setting a `layout` property as part of your page metadata (if you are using the `~/pages` integration), or by using the `<NuxtLayout>` component. (**Note**: The layout name is normalized to kebab-case, so `someLayout` becomes `some-layout`.)
If you only have a single layout in your application, we recommend using [app.vue](/guide/directory-structure/app) instead. If you only have a single layout in your application, we recommend using [app.vue](/guide/directory-structure/app) instead.

View File

@ -15,7 +15,7 @@ Route middleware run within the Vue part of your Nuxt app. Despite the similar n
There are three kinds of route middleware: There are three kinds of route middleware:
1. Anonymous (or inline) route middleware, which are defined directly in the pages where they are used. 1. Anonymous (or inline) route middleware, which are defined directly in the pages where they are used.
2. Named route middleware, which are placed in the `middleware/` directory and will be automatically loaded via asynchronous import when used on a page. 2. Named route middleware, which are placed in the `middleware/` directory and will be automatically loaded via asynchronous import when used on a page. (**Note**: The route middleware name is normalized to kebab-case, so `someMiddleware` becomes `some-middleware`.)
3. Global route middleware, which are placed in the `middleware/` directory (with a `.global` suffix) and will be automatically run on every route change. 3. Global route middleware, which are placed in the `middleware/` directory (with a `.global` suffix) and will be automatically run on every route change.
The first two kinds of route middleware can be [defined in `definePageMeta`](/guide/directory-structure/pages). The first two kinds of route middleware can be [defined in `definePageMeta`](/guide/directory-structure/pages).

View File

@ -141,8 +141,11 @@ export default defineNuxtPlugin(async (nuxtApp) => {
for (const entry of middlewareEntries) { for (const entry of middlewareEntries) {
const middleware = typeof entry === 'string' ? nuxtApp._middleware.named[entry] || await namedMiddleware[entry]?.().then(r => r.default || r) : entry const middleware = typeof entry === 'string' ? nuxtApp._middleware.named[entry] || await namedMiddleware[entry]?.().then(r => r.default || r) : entry
if (process.dev && !middleware) { if (!middleware) {
console.warn(`Unknown middleware: ${entry}. Valid options are ${Object.keys(namedMiddleware).join(', ')}.`) if (process.dev) {
throw new Error(`Unknown route middleware: '${entry}'. Valid middleware: ${Object.keys(namedMiddleware).map(mw => `'${mw}'`).join(', ')}.`)
}
throw new Error(`Unknown route middleware: '${entry}'.`)
} }
const result = await callWithNuxt(nuxtApp, middleware, [to, from]) const result = await callWithNuxt(nuxtApp, middleware, [to, from])