Skip to content

perf(module): use moduleDependencies to manipulate options #4927

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 6 commits into
base: v4
Choose a base branch
from
Open

perf(module): use moduleDependencies to manipulate options #4927

Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
de16a5d
perf: use module dependencies to manipulate options
danielroe Sep 8, 2025
e500a27
chore: remove exsolve
danielroe Sep 8, 2025
398e194
Merge branch 'v4' into refactor/deps
benjamincanac Oct 17, 2025
a6b82ba
Merge remote-tracking branch 'origin/v4' into refactor/deps
danielroe Oct 26, 2025
6331bc3
chore: import from 'nuxt/schema'
danielroe Oct 27, 2025
49f7c1a
Merge remote-tracking branch 'origin/v4' into refactor/deps
danielroe Oct 27, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
133 changes: 69 additions & 64 deletions src/module.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { defu } from 'defu'
import { createResolver, defineNuxtModule, addComponentsDir, addImportsDir, addPlugin, installModule, hasNuxtModule } from '@nuxt/kit'
import { createResolver, defineNuxtModule, addComponentsDir, addImportsDir, addPlugin, hasNuxtModule } from '@nuxt/kit'
import type { HookResult } from '@nuxt/schema'
import type { ModuleDependencies } from 'nuxt/schema'
import { addTemplates } from './templates'
import { defaultOptions, getDefaultUiConfig, resolveColors } from './defaults'
import { name, version } from '../package.json'
Expand Down Expand Up @@ -109,10 +110,76 @@ export default defineNuxtModule<ModuleOptions>({
docs: 'https://ui.nuxt.com/docs/getting-started/installation/nuxt',
configKey: 'ui',
compatibility: {
nuxt: '>=4.0.0'
nuxt: '>=4.1.0'
}
},
defaults: defaultOptions,
moduleDependencies(nuxt): ModuleDependencies {
const userUiOptions = nuxt.options.ui || {}
return {
'@nuxt/icon': {
defaults: {
cssLayer: 'components'
}
},
...userUiOptions.fonts !== false && {
'@nuxt/fonts': {
defaults: {
defaults: {
weights: [400, 500, 600, 700]
}
Comment on lines +128 to +130
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
defaults: {
weights: [400, 500, 600, 700]
}
weights: [400, 500, 600, 700]

The @nuxt/fonts module configuration has an extra nested defaults property that shouldn't be there, which will cause the module to receive incorrect configuration.

View Details

Analysis

Extra nested defaults property in @nuxt/fonts moduleDependencies configuration

What fails: The @nuxt/fonts module configuration in src/module.ts line 123 has an unnecessary nested defaults property: defaults: { defaults: { weights: [...] } } instead of the correct defaults: { weights: [...] }

How to reproduce:

# Both configurations work, but the nested one is incorrect:
git log --oneline -p -S "defaults: {" -- src/module.ts
# Shows migration from registerModule to moduleDependencies introduced extra nesting

Result: The configuration works due to @nuxt/fonts being robust, but contains unnecessary nesting introduced during migration from registerModule('@nuxt/fonts', 'fonts', { defaults: { weights: [...] } }) to moduleDependencies structure

Expected: Should use single-level defaults consistent with other modules like @nuxt/icon and @nuxtjs/color-mode in the same configuration block, per Nuxt Kit moduleDependencies docs

}
}
},
...userUiOptions.colorMode !== false && {
'@nuxtjs/color-mode': {
defaults: {
classSuffix: '',
disableTransition: true
}
}
},
'@nuxtjs/mdc': {
optional: true,
defaults: {
highlight: {
theme: {
light: 'material-theme-lighter',
default: 'material-theme',
dark: 'material-theme-palenight'
}
},
components: {
map: {
'accordion': 'ProseAccordion',
'accordion-item': 'ProseAccordionItem',
'badge': 'ProseBadge',
'callout': 'ProseCallout',
'card': 'ProseCard',
'card-group': 'ProseCardGroup',
'caution': 'ProseCaution',
'code-collapse': 'ProseCodeCollapse',
'code-group': 'ProseCodeGroup',
'code-icon': 'ProseCodeIcon',
'code-preview': 'ProseCodePreview',
'code-tree': 'ProseCodeTree',
'collapsible': 'ProseCollapsible',
'field': 'ProseField',
'field-group': 'ProseFieldGroup',
'icon': 'ProseIcon',
'kbd': 'ProseKbd',
'note': 'ProseNote',
'steps': 'ProseSteps',
'tabs': 'ProseTabs',
'tabs-item': 'ProseTabsItem',
'tip': 'ProseTip',
'warning': 'ProseWarning'
}
}
}
}
}
},
async setup(options, nuxt) {
const { resolve } = createResolver(import.meta.url)

Expand All @@ -138,71 +205,9 @@ export default defineNuxtModule<ModuleOptions>({
nuxt.options.postcss.plugins['@tailwindcss/postcss'] = {}
}

async function registerModule(name: string, key: string, options: Record<string, any>) {
if (!hasNuxtModule(name)) {
await installModule(name, defu((nuxt.options as any)[key], options))
} else {
(nuxt.options as any)[key] = defu((nuxt.options as any)[key], options)
}
}

await registerModule('@nuxt/icon', 'icon', {
cssLayer: 'components'
})
if (options.fonts) {
await registerModule('@nuxt/fonts', 'fonts', {
defaults: {
weights: [400, 500, 600, 700]
}
})
}
if (options.colorMode) {
await registerModule('@nuxtjs/color-mode', 'colorMode', {
classSuffix: '',
disableTransition: true
})
}

addPlugin({ src: resolve('./runtime/plugins/colors') })

if ((hasNuxtModule('@nuxtjs/mdc') || options.mdc) || (hasNuxtModule('@nuxt/content') || options.content)) {
nuxt.options.mdc = defu(nuxt.options.mdc, {
highlight: {
theme: {
light: 'material-theme-lighter',
default: 'material-theme',
dark: 'material-theme-palenight'
}
},
components: {
map: {
'accordion': 'ProseAccordion',
'accordion-item': 'ProseAccordionItem',
'badge': 'ProseBadge',
'callout': 'ProseCallout',
'card': 'ProseCard',
'card-group': 'ProseCardGroup',
'caution': 'ProseCaution',
'code-collapse': 'ProseCodeCollapse',
'code-group': 'ProseCodeGroup',
'code-icon': 'ProseCodeIcon',
'code-preview': 'ProseCodePreview',
'code-tree': 'ProseCodeTree',
'collapsible': 'ProseCollapsible',
'field': 'ProseField',
'field-group': 'ProseFieldGroup',
'icon': 'ProseIcon',
'kbd': 'ProseKbd',
'note': 'ProseNote',
'steps': 'ProseSteps',
'tabs': 'ProseTabs',
'tabs-item': 'ProseTabsItem',
'tip': 'ProseTip',
'warning': 'ProseWarning'
}
}
})

addComponentsDir({
path: resolve('./runtime/components/prose'),
pathPrefix: false,
Expand Down
Loading