diff --git a/docs/2.guide/3.going-further/8.custom-routing.md b/docs/2.guide/3.going-further/8.custom-routing.md
index a5c8b708d2..20d8da1e6f 100644
--- a/docs/2.guide/3.going-further/8.custom-routing.md
+++ b/docs/2.guide/3.going-further/8.custom-routing.md
@@ -92,7 +92,7 @@ export default <RouterConfig> {
 }
 ```
 
-It is possible to add more router options files by adding files within the `pages:routerOptions` hook.
+It is possible to add more router options files by adding files within the `pages:routerOptions` hook. Later items in the array override earlier ones.
 
 ::alert
 Adding a router options file in this hook will switch on page-based routing, unless `optional` is set, in which case it will only apply when page-based routing is already enabled.
diff --git a/docs/3.api/6.advanced/1.hooks.md b/docs/3.api/6.advanced/1.hooks.md
index b0f407f1f9..35520e27c3 100644
--- a/docs/3.api/6.advanced/1.hooks.md
+++ b/docs/3.api/6.advanced/1.hooks.md
@@ -50,7 +50,7 @@ Hook                     | Arguments                  | Description
 `builder:generateApp`    | `options`                  | Called before generating the app.
 `builder:watch`          | `event, path`              | Called at build time in development when the watcher spots a change to a file or directory in the project.
 `pages:extend`           | `pages`                    | Called after pages routes are resolved.
-`pages:routerOptions`   | `{ files: Array<{ path: string, optional?: boolean }> }` | Called when resolving `router.options` files.
+`pages:routerOptions`   | `{ files: Array<{ path: string, optional?: boolean }> }` | Called when resolving `router.options` files. Later items in the array override earlier ones.
 `server:devHandler`      | `handler`                  | Called when the dev middleware is being registered on the Nitro dev server.
 `imports:sources`        | `presets`                  | Called at setup allowing modules to extend sources.
 `imports:extend`         | `imports`                  | Called at setup allowing modules to extend imports.
diff --git a/packages/nuxt/src/pages/module.ts b/packages/nuxt/src/pages/module.ts
index fe7c5cdfe5..9e610a14eb 100644
--- a/packages/nuxt/src/pages/module.ts
+++ b/packages/nuxt/src/pages/module.ts
@@ -35,14 +35,15 @@ export default defineNuxtModule({
       const context = {
         files: [] as Array<{ path: string, optional?: boolean }>
       }
-      // Add default options
-      context.files.push({ path: resolve(runtimeDir, 'router.options'), optional: true })
 
       for (const layer of nuxt.options._layers) {
         const path = await findPath(resolve(layer.config.srcDir, 'app/router.options'))
-        if (path) { context.files.push({ path }) }
+        if (path) { context.files.unshift({ path }) }
       }
 
+      // Add default options at beginning
+      context.files.unshift({ path: resolve(runtimeDir, 'router.options'), optional: true })
+
       await nuxt.callHook('pages:routerOptions', context)
       return context.files
     }
@@ -444,8 +445,7 @@ export default defineNuxtModule({
           `const configRouterOptions = ${configRouterOptions}`,
           'export default {',
           '...configRouterOptions,',
-          // We need to reverse spreading order to respect layers priority
-          ...routerOptionsFiles.map((_, index) => `...routerOptions${index},`).reverse(),
+          ...routerOptionsFiles.map((_, index) => `...routerOptions${index},`),
           '}'
         ].join('\n')
       }
diff --git a/packages/schema/src/types/hooks.ts b/packages/schema/src/types/hooks.ts
index 1a562d750a..5fe595d314 100644
--- a/packages/schema/src/types/hooks.ts
+++ b/packages/schema/src/types/hooks.ts
@@ -174,6 +174,8 @@ export interface NuxtHooks {
    * Called when resolving `app/router.options` files. It allows modifying the detected router options files
    * and adding new ones.
    *
+   * Later items in the array override earlier ones.
+   *
    * Adding a router options file will switch on page-based routing, unless `optional` is set, in which case
    * it will only apply when page-based routing is already enabled.
    * @param context An object with `files` containing an array of router options files.
diff --git a/test/fixtures/basic/extends/node_modules/foo/middleware/override.ts b/test/fixtures/basic/extends/node_modules/foo/middleware/override.ts
index fbbfd73091..eca4b646c3 100644
--- a/test/fixtures/basic/extends/node_modules/foo/middleware/override.ts
+++ b/test/fixtures/basic/extends/node_modules/foo/middleware/override.ts
@@ -1,3 +1,3 @@
 export default defineNuxtRouteMiddleware((to) => {
-  to.meta.override = 'This middleware should be overriden by bar'
+  to.meta.override = 'This middleware should be overridden by bar'
 })
diff --git a/test/fixtures/basic/nuxt.config.ts b/test/fixtures/basic/nuxt.config.ts
index 3c6253e4c4..19b5565303 100644
--- a/test/fixtures/basic/nuxt.config.ts
+++ b/test/fixtures/basic/nuxt.config.ts
@@ -37,8 +37,9 @@ export default defineNuxtConfig({
       }
     ]
   },
-  theme: './extends/bar',
   css: ['~/assets/global.css'],
+  // this produces an order of `~` > `~/extends/bar` > `~/extends/node_modules/foo`
+  theme: './extends/bar',
   extends: [
     './extends/node_modules/foo'
   ],