feat: add examples of order of execution middleware

Author: bencodezen

middleware/01.setup.global.js

@@ -0,0 +1,3 @@
+export default defineNuxtRouteMiddleware((to, from) => {
+  console.log('--- Setup Global Middleware ---')
+})

middleware/analytics.global.js renamed to middleware/02.analytics.global.js

@@ -1,4 +1,5 @@
 export default defineNuxtRouteMiddleware((to, from) => {
+  console.log('--- Analytics Middleware ---')
   console.log('from', from)
   console.log('to', to)
 })

middleware/10.new.global.js

@@ -0,0 +1,3 @@
+export default defineNuxtRouteMiddleware((to, from) => {
+  console.log('--- New Global Middleware ---')
+})

middleware/logout.js

@@ -0,0 +1,3 @@
+export default defineNuxtRouteMiddleware((to, from) => {
+  console.log('--- Logout Middleware ---')
+})

middleware/profile.js

@@ -7,4 +7,6 @@ export default defineNuxtRouteMiddleware((to, from) => {
   } else if (to.params.username !== currentUser.value) {
     return navigateTo('/profile/' + currentUser.value)
   }
+
+  console.log('--- Profile Middleware ---')
 })

pages/logout.vue

@@ -1,14 +1,18 @@
 <script setup>
 definePageMeta({
-  middleware: function (to, from) {
-    const isAuthenticated = useCookie('is-authenticated')
-    const currentUser = useCookie('current-user')
+  middleware: [
+    'logout',
+    function (to, from) {
+      console.log('--- Inline Logout Middleware ---')
+      const isAuthenticated = useCookie('is-authenticated')
+      const currentUser = useCookie('current-user')
 
-    isAuthenticated.value = ''
-    currentUser.value = ''
+      isAuthenticated.value = ''
+      currentUser.value = ''
 
-    return navigateTo('/')
-  }
+      return navigateTo('/')
+    }
+  ]
 })
 </script>