utils/add-route-middleware

10 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

addRouteMiddleware function signature

addRouteMiddleware has two overloads. The first takes a name (string), a middleware (RouteMiddleware function), and optional AddRouteMiddlewareOptions object. The second overload takes only a middleware (RouteMiddleware function) with no name. Both return void.

addRouteMiddleware name parameter

The name parameter is of type string or RouteMiddleware. When provided as a string, it identifies the named middleware. When a RouteMiddleware function is passed as the first argument instead of a string, the middleware is treated as anonymous/unnamed.

addRouteMiddleware middleware parameter

The middleware parameter is a function of type RouteMiddleware. It receives two arguments: the next route object (to) as the first argument and the current route object (from) as the second argument. Both are Vue route objects. This parameter is optional if the first argument is already a function.

addRouteMiddleware options parameter

The options parameter is of type AddRouteMiddlewareOptions and is optional. It has a global property of type boolean (default false) that indicates whether the route middleware should run on every route change.

addRouteMiddleware AddRouteMiddlewareOptions interface

AddRouteMiddlewareOptions has one property: global (boolean, optional, default false). Setting global to true makes the middleware run on every route change.

Named route middleware with addRouteMiddleware

A named route middleware is created by passing a string as the first argument and a RouteMiddleware function as the second argument to addRouteMiddleware(). When defined in a plugin, it overrides any existing middleware with the same name located in the app/middleware/ directory.

Global route middleware with addRouteMiddleware anonymous

Global route middleware can be created by passing a RouteMiddleware function directly as the first argument to addRouteMiddleware() without a name. This anonymous middleware is automatically treated as global and applied on every route change.

Global route middleware with addRouteMiddleware named

Global route middleware can also be created by passing a string name as the first argument, a RouteMiddleware function as the second argument, and { global: true } as the options third argument to addRouteMiddleware().

addRouteMiddleware anonymous global middleware example

Example of anonymous global route middleware defined in a plugin: ```ts export default defineNuxtPlugin(() => { addRouteMiddleware((to, from) => { console.log('anonymous global middleware that runs on every route change') }) }) ```

addRouteMiddleware named global middleware example

Example of named global route middleware defined in a plugin: ```ts export default defineNuxtPlugin(() => { addRouteMiddleware('global-middleware', (to, from) => { console.log('global middleware that runs on every route change') }, { global: true }, ) }) ```

Give your agent this brain