feat(kit): add addRouteMiddleware method

[xtoolkit]

🔗 Linked issue

resolves #3934

❓ Type of change

• 📖 Documentation (updates to the documentation or readme)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality like performance)
• ✨ New feature (a non-breaking change that adds functionality)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

This method help to modules for add middlewares

addRouteMiddleware({
  name: 'test',
  path: 'path-to-middleware'
})

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.

[codesandbox]

  Open in CodeSandbox Web Editor | VS Code | VS Code Insiders

[pi0]

It would be nice to:

• Support input argument being directly an array to inject
• Support returning new middleware from cb and push/normalize/dedup them into app.middleware <-- this would be much safer than just exposing an array and let developers push into it

[xtoolkit]

you want like this?

function extendMiddleware (newMiddleware: NuxtMiddleware[] | NuxtMiddleware): void;
function extendMiddleware (cb: (middleware: NuxtMiddleware[]) => NuxtMiddleware[]): void;
function extendMiddleware (input: any) {
  const nuxt = useNuxt()
  nuxt.hook('app:resolve', (app) => {
    if (Array.isArray(input)) {
      app.middleware = [...app.middleware, ...input]
    } else if(typeof input === 'object') {
      app.middleware = [...app.middleware, input]
    } else {
      app.middleware = [...input(app.middleware)]
    }
  })
}

we can add option argument for override middleware by name, if you think this is good.

[danielroe]

This is my suggestion for the API:

function addRouteMiddleware (input: NuxtMiddleware | NuxtMiddleware[], options: { override: boolean }): void

Under the hood, if override is not set, then we will check existing middleware for any of the same name, and warn the user if so (and not replace the existing middleware).

[danielroe]

(Feel free to ping me on Discord if I can be of any help.)

[xtoolkit]

hi again

In addRouteMiddleware api, module can only add middleware. why not use Adding middleware Dynamically helper.

but in extendMiddleware api, module can manage all middleware. like delete, sort and etc

an this moment, nuxt core team must decide which one to implement

tnx <3

[danielroe]

I would prefer addRouteMiddleware, just as we have addLayout, addPlugin, etc but do not add convenient helpers for deleting/sorting layouts and plugins. Modules that need to do more advanced things can directly interact with the hook. Adding route middleware dynamically misses out on features like type support.

[xtoolkit]

you are right.
for advance change better to use hooks.

if you are not comment or change this #18553 (comment) api, i can implement that.

[danielroe]

Yes, that would be perfect, thank you ❤️

[danielroe]

Beautiful! Thank you.