fix(kit): respect priority when registering components dirs (#22882)

packages/kit/src/components.ts

@@ -12,6 +12,7 @@ export async function addComponentsDir (dir: ComponentsDir) {
   const nuxt = useNuxt()
   await assertNuxtCompatibility({ nuxt: '>=2.13' }, nuxt)
   nuxt.options.components = nuxt.options.components || []
+  dir.priority ||= 0
   nuxt.hook('components:dirs', (dirs) => { dirs.push(dir) })
 }
 

packages/nuxt/src/components/scan.ts

@@ -121,7 +121,7 @@ export async function scanComponents (dirs: ComponentsDir[], srcDir: string): Pr
         shortPath,
         export: 'default',
         // by default, give priority to scanned components
-        priority: 1
+        priority: dir.priority ?? 1
       }
 
       if (typeof dir.extendComponent === 'function') {
@@ -135,9 +135,15 @@ export async function scanComponents (dirs: ComponentsDir[], srcDir: string): Pr
       }
 
       const existingComponent = components.find(c => c.pascalName === component.pascalName && ['all', component.mode].includes(c.mode))
-      if (existingComponent) {
       // Ignore component if component is already defined (with same mode)
+      if (existingComponent) {
+        const existingPriority = existingComponent.priority ?? 0
+        const newPriority = component.priority ?? 0
+
+        if (newPriority >= existingPriority) {
           warnAboutDuplicateComponent(componentName, filePath, existingComponent.filePath)
+        }
+
         continue
       }
 

packages/schema/src/types/components.ts

@@ -85,6 +85,14 @@ export interface ComponentsDir extends ScanDir {
    * By default ('auto') it will set transpile: true if node_modules/ is in path.
    */
   transpile?: 'auto' | boolean
+  /**
+   * This number allows configuring the behavior of overriding Nuxt components.
+   * It will be inherited by any components within the directory.
+   *
+   * If multiple components are provided with the same name, then higher priority
+   * components will be used instead of lower priority components.
+   */
+  priority?: number
 }
 
 export interface ComponentsOptions {