diff --git a/packages/kit/src/components.ts b/packages/kit/src/components.ts index 9200c91c3c..294714d273 100644 --- a/packages/kit/src/components.ts +++ b/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) }) } diff --git a/packages/nuxt/src/components/scan.ts b/packages/nuxt/src/components/scan.ts index cfee6e2ad0..4f367370b8 100644 --- a/packages/nuxt/src/components/scan.ts +++ b/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)) + // Ignore component if component is already defined (with same mode) if (existingComponent) { - // Ignore component if component is already defined (with same mode) - warnAboutDuplicateComponent(componentName, filePath, existingComponent.filePath) + const existingPriority = existingComponent.priority ?? 0 + const newPriority = component.priority ?? 0 + + if (newPriority >= existingPriority) { + warnAboutDuplicateComponent(componentName, filePath, existingComponent.filePath) + } + continue } diff --git a/packages/schema/src/types/components.ts b/packages/schema/src/types/components.ts index 6ca1ab773f..010fae5ef0 100644 --- a/packages/schema/src/types/components.ts +++ b/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 {