Nuxt•4w ago

Middlewares run before plugins are initialized?

Hey everyone. We're having a lot of trouble with our Nuxt instance, where seemigly middlewares can be running before plugins are fully initialized. Which in our case breaks pinia stores that are accessed in middlewares and other strange things. I even found this rather new bug report from someone else on https://github.com/nuxt/nuxt/issues/30824 Any ideas on this? Might this be a nuxt-internal bug?

GitHub

Production mode: Middleware triggered before plugin · Issue #30824 ...

Environment Operating System: Windows_NT Node Version: v20.14.0 Nuxt Version: 3.15.4 CLI Version: 3.21.1 Nitro Version: 2.10.4 Package Manager: [email protected] Builder: - User Config: ssr, compatibility...

2 Replies

kapa.ai•4w ago

Hi @Patrick. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Based on the knowledge sources provided, it appears that there is indeed an issue related to the order of execution between middleware and plugins in Nuxt. This is a known problem that has been reported and discussed in the Nuxt community. The GitHub issue you mentioned (https://github.com/nuxt/nuxt/issues/30824) is relevant to this problem. However, the knowledge sources don't provide enough information to confirm if this is definitively a Nuxt-internal bug. That being said, there are a couple of important points to consider: 1. Middleware Execution: According to the Nuxt documentation on middleware, middleware for the initial page is executed both when the page is rendered and again on the client. This behavior might lead to unexpected results, especially if the middleware relies on browser-specific features or client-side state. 2. Ordering of Execution: The documentation doesn't explicitly state that middleware runs before plugins are initialized. In fact, plugins are typically initialized before route middleware is executed. To mitigate issues related to middleware execution, you can try the following approach mentioned in the Nuxt documentation:

export default defineNuxtRouteMiddleware(to => {
  // skip middleware on server
  if (import.meta.server) return
  // skip middleware on client side entirely
  if (import.meta.client) return
  // or only skip middleware on initial client load
  const nuxtApp = useNuxtApp()
  if (import.meta.client && nuxtApp.isHydrating && nuxtApp.payload.serverRendered) return
})

export default defineNuxtRouteMiddleware(to => {
  // skip middleware on server
  if (import.meta.server) return
  // skip middleware on client side entirely
  if (import.meta.client) return
  // or only skip middleware on initial client load
  const nuxtApp = useNuxtApp()
  if (import.meta.client && nuxtApp.isHydrating && nuxtApp.payload.serverRendered) return
})

This code snippet allows you to control when the middleware runs, potentially avoiding issues with uninitialized plugins or stores. If you're still experiencing issues after trying this approach, it might be worth creating a minimal reproduction of the problem and reporting it to the Nuxt GitHub repository. The Nuxt team encourages users to report bugs with detailed reproductions to help identify and fix potential internal issues. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•4w ago

<@186430240493404171> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

Gaming

Programming

Middlewares run before plugins are initialized?

Did you find this page helpful?