feat(nuxt): sort numbered middleware/plugins from all layers

packages/nuxt/src/core/app.ts

@@ -2,7 +2,7 @@
 import { dirname, join, relative, resolve } from 'pathe'
 import { defu } from 'defu'
 import { compileTemplate, findPath, logger, normalizePlugin, normalizeTemplate, resolveAlias, resolveFiles, resolvePath, templateUtils, tryResolveModule } from '@nuxt/kit'
-import type { Nuxt, NuxtApp, NuxtPlugin, NuxtTemplate, ResolvedNuxtTemplate } from 'nuxt/schema'
+import type { Nuxt, NuxtApp, NuxtMiddleware, NuxtPlugin, NuxtTemplate, ResolvedNuxtTemplate } from 'nuxt/schema'
 
 import * as defaultTemplates from './templates'
 import { getNameFromPath, hasSuffix, uniqueBy } from './utils'
@@ -150,6 +150,9 @@
  }
  }
 
+ // hoist (and sort) middleware beginning with a number
+ app.middleware = sortMiddleware(app.middleware)
+
  // Resolve plugins, first extended layers and then base
  app.plugins = []
  for (const config of reversedConfigs) {
@@ -233,7 +236,7 @@
  for (const plugin of _plugins) {
  // Make sure dependency plugins are registered
  if (plugin.dependsOn && plugin.dependsOn.some(name => !pluginNames.includes(name))) {
  console.error(`Plugin \`${plugin.name}\` depends on \`${plugin.dependsOn.filter(name => !pluginNames.includes(name)).join(', ')}\` but they are not registered.`)
  }
  // Make graph to detect circular dependencies
  if (plugin.name) {
@@ -242,7 +245,7 @@
  }
  const checkDeps = (name: string, visited: string[] = []): string[] => {
  if (visited.includes(name)) {
  console.error(`Circular dependency detected in plugins: ${visited.join(' -> ')} -> ${name}`)
  return []
  }
  visited.push(name)
@@ -252,3 +255,19 @@
  checkDeps(name)
  }
 }
+
+function sortOrderedMiddleware (middleware: NuxtMiddleware[]) {
+ const reg = /^\d+\./
+ const orderedMiddleware = middleware.filter(m => reg.test(m.name)).sort((l, r) => l.name > r.name ? 1 : -1)
+ const unorderedMiddleware = middleware.filter(m => !reg.test(m.name))
+ return [...orderedMiddleware, ...unorderedMiddleware]
+}
+
+function sortMiddleware (middleware: NuxtMiddleware[]) {
+ const globalMiddleware = middleware.filter(mw => mw.global)
+ const namedMiddleware = middleware.filter(mw => !mw.global)
+ return [
+ ...sortOrderedMiddleware(globalMiddleware),
+ ...sortOrderedMiddleware(namedMiddleware)
+ ]
+}

packages/nuxt/test/app.test.ts

@@ -152,17 +152,20 @@ describe('resolveApp', () => {
  it('resolves layer middleware in correct order', async () => {
  const app = await getResolvedApp([
  // layer 1
+ 'layer1/middleware/01.order.global.ts',
  'layer1/middleware/global.global.ts',
  'layer1/middleware/named-from-layer.ts',
  'layer1/middleware/named-override.ts',
  'layer1/nuxt.config.ts',
  // layer 2
+ 'layer2/middleware/02.order.global.ts',
  'layer2/middleware/global.global.ts',
  'layer2/middleware/named-from-layer.ts',
  'layer2/middleware/named-override.ts',
  'layer2/plugins/override-test.ts',
  'layer2/nuxt.config.ts',
  // final (user) layer
+ 'middleware/00.order.global.ts',
  'middleware/named-override.ts',
  'middleware/named.ts',
  {
@@ -171,9 +174,12 @@ describe('resolveApp', () => {
  }
  ])
  const fixtureMiddleware = app.middleware.filter(p => p.path.includes('<rootDir>')).map(p => p.path)
- // TODO: fix this
+
  expect(fixtureMiddleware).toMatchInlineSnapshot(`
  [
+ "<rootDir>/middleware/00.order.global.ts",
+ "<rootDir>/layer1/middleware/01.order.global.ts",
+ "<rootDir>/layer2/middleware/02.order.global.ts",
  "<rootDir>/layer2/middleware/global.global.ts",
  "<rootDir>/layer2/middleware/named-from-layer.ts",
  "<rootDir>/middleware/named-override.ts",