Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

Nuxt middleware & page setup does not execute in the expected order when refreshing page

Offen
  • Stimmt etwas nicht?
#564 5 Kommentare 2 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Maintainer antworten meist innerhalb von 1 Tag

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Anfängerfreundlichkeit
35/100
Issue-Typ
Bug
Klarheit
Größtenteils klar
Aktivitätsstatus
Veraltet
Tech-Stack
nuxtjs, typescript
Bereich
frontend, mobile

Rechercherichtung

Beginne mit der verlinkten StackBlitz-Reproduktion und vergleiche die Nuxt-only-, Ionic-, i18n- und Ionic-plus-i18n-Konfigurationen. Untersuche die in der Issue erwähnte nuxt.config-Router-Integrationseinstellung und reproduziere das Verhalten beim Aktualisieren. Als abgeschlossen gilt die Aufgabe, wenn das kombinierte Setup die erwartete Reihenfolge beibehält: globale Middleware, Seiten-Middleware, App-Setup, dann Seiten-Setup.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

bug
🐛 The bug

I was using middleware to fetch user configuration data before navigating to pages, when I realized that the page setup was run before the middleware. Through some trial and error I figured out that removing Nuxt/ionic fixed the issue, but I also found out that adding the Nuxtjs/i18n module worsened the issue.

So I created a project tracking the following:

  • Global middleware
  • Page middleware
  • App setup function
  • Page setup function

And I got these results:

  • (Nuxt alone) works as expected:
    image
  • (Nuxt + Nuxt/ionic) App setup gets run first but everything else in the correct order:
    image
  • (Nuxt + Nuxtjs/i18n) works as expected:
    image
  • (Nuxt + Nuxt/ionic + Nuxtjs/i18n) every page setup is run before middleware
    image

I'm still pretty new to Nuxt & Ionic so I might be completely missing some critical information, but the Nuxt/ionic documentation gives the impression that middleware should just work with no caveats.

🛠️ To reproduce

https://stackblitz.com/edit/hui123

🌈 Expected behaviour

For the execution order to match the basic Nuxt project when refreshing the page, and to also work with the i18n nuxt module

  1. Global middleware
  2. Page middleware
  3. App setup function
  4. Page setup function
ℹ️ Additional context

Reproductions used to get the different results:
Nuxt middleware order (Nuxt only)
Nuxt middleware order (Ionic)
Nuxt middleware order (i18n)
Nuxt middleware order (Ionic + i18n)

It might be related to the ionic router integration, because if I disable it in nuxt.config the execution order goes back to normal.

Vorherrschende Sprache
TypeScript
Sterne
457
Forks
54
Ø Merge
1 T. 7 Std.
Gemergte PRs (30 T.)
18

Entwicklungsumgebung

Dieses Projekt bietet weder Dev-Container noch Dockerfile noch Beitragsleitfaden – die Einrichtung liegt bei Ihnen. Beginnen Sie mit der README; die allgemeinen Schritte stehen in unserem Leitfaden für den ersten Beitrag.

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus nuxt-modules/ionic

Alle Issues in nuxt-modules/ionic

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.