2021-11-21 16:14:46 +00:00
|
|
|
import { pascalCase, kebabCase } from 'scule'
|
|
|
|
import type { ComponentsDir, Component } from '@nuxt/schema'
|
|
|
|
import { useNuxt } from './context'
|
2021-12-21 13:57:26 +00:00
|
|
|
import { assertNuxtCompatibility } from './compatibility'
|
2021-11-21 16:14:46 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Register a directory to be scanned for components and imported only when used.
|
|
|
|
*
|
|
|
|
* Requires Nuxt 2.13+
|
|
|
|
*/
|
2021-12-21 13:57:26 +00:00
|
|
|
export async function addComponentsDir (dir: ComponentsDir) {
|
2021-11-21 16:14:46 +00:00
|
|
|
const nuxt = useNuxt()
|
2021-12-21 13:57:26 +00:00
|
|
|
await assertNuxtCompatibility({ nuxt: '>=2.13' }, nuxt)
|
2021-11-21 16:14:46 +00:00
|
|
|
nuxt.options.components = nuxt.options.components || []
|
|
|
|
nuxt.hook('components:dirs', (dirs) => { dirs.push(dir) })
|
|
|
|
}
|
|
|
|
|
|
|
|
export type AddComponentOptions = { name: string, filePath: string } & Partial<Exclude<Component,
|
|
|
|
'shortPath' | 'async' | 'level' | 'import' | 'asyncImport'
|
|
|
|
>>
|
|
|
|
|
|
|
|
/**
|
2023-03-07 11:12:54 +00:00
|
|
|
* Register a component by its name and filePath.
|
2021-11-21 16:14:46 +00:00
|
|
|
*
|
|
|
|
* Requires Nuxt 2.13+
|
|
|
|
*/
|
2021-12-21 13:57:26 +00:00
|
|
|
export async function addComponent (opts: AddComponentOptions) {
|
2021-11-21 16:14:46 +00:00
|
|
|
const nuxt = useNuxt()
|
2021-12-21 13:57:26 +00:00
|
|
|
await assertNuxtCompatibility({ nuxt: '>=2.13' }, nuxt)
|
2021-11-21 16:14:46 +00:00
|
|
|
nuxt.options.components = nuxt.options.components || []
|
|
|
|
|
|
|
|
// Apply defaults
|
|
|
|
const component: Component = {
|
|
|
|
export: opts.export || 'default',
|
|
|
|
chunkName: 'components/' + kebabCase(opts.name),
|
|
|
|
global: opts.global ?? false,
|
|
|
|
kebabName: kebabCase(opts.name || ''),
|
|
|
|
pascalName: pascalCase(opts.name || ''),
|
|
|
|
prefetch: false,
|
|
|
|
preload: false,
|
2022-04-19 19:13:55 +00:00
|
|
|
mode: 'all',
|
2021-11-21 16:14:46 +00:00
|
|
|
shortPath: opts.filePath,
|
2023-03-06 11:33:40 +00:00
|
|
|
priority: 0,
|
2021-11-21 16:14:46 +00:00
|
|
|
...opts
|
|
|
|
}
|
|
|
|
|
|
|
|
nuxt.hook('components:extend', (components: Component[]) => {
|
2022-07-01 10:02:34 +00:00
|
|
|
const existingComponent = components.find(c => (c.pascalName === component.pascalName || c.kebabName === component.kebabName) && c.mode === component.mode)
|
2021-11-21 16:14:46 +00:00
|
|
|
if (existingComponent) {
|
2023-03-06 11:33:40 +00:00
|
|
|
const existingPriority = existingComponent.priority ?? 0
|
|
|
|
const newPriority = component.priority ?? 0
|
|
|
|
|
|
|
|
if (newPriority < existingPriority) { return }
|
|
|
|
|
|
|
|
// We override where new component priority is equal or higher
|
|
|
|
// but we warn if they are equal.
|
|
|
|
if (newPriority === existingPriority) {
|
|
|
|
const name = existingComponent.pascalName || existingComponent.kebabName
|
|
|
|
console.warn(`Overriding ${name} component. You can specify a \`priority\` option when calling \`addComponent\` to avoid this warning.`)
|
|
|
|
}
|
2021-11-21 16:14:46 +00:00
|
|
|
Object.assign(existingComponent, component)
|
|
|
|
} else {
|
|
|
|
components.push(component)
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|