resolving

10 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

resolvePath function signature

The resolvePath function has the signature: function resolvePath (path: string, options?: ResolvePathOptions): Promise<string>. It resolves the full path to a file or directory, respecting Nuxt alias and extensions options. If a path could not be resolved, a normalized input path will be returned.

resolvePath module resolution note

resolvePath follows standard module resolution and does not search dependencies nested inside other packages. To resolve a dependency declared by your Nuxt module, use createResolver(import.meta.url).resolvePath(). This makes resolution independent of whether the package manager hoists the dependency.

resolveAlias function signature

The resolveAlias function has the signature: function resolveAlias (path: string, alias?: Record<string, string>): string. It resolves path aliases respecting Nuxt alias options. If alias is not provided, it will be read from nuxt.options.alias.

findPath function signature

The findPath function has the signature: function findPath (paths: string | string[], options?: ResolvePathOptions, pathType: 'file' | 'dir'): Promise<string | null>. It tries to resolve the first existing file in a given set of paths.

findPath options parameters

The findPath options object can have the following properties: cwd (string, not required, base for resolving paths from, default is Nuxt rootDir), alias (Record<string, string>, not required, an object of aliases, default is Nuxt configured aliases), extensions (string[], not required, the file extensions to try, default is Nuxt configured extensions), virtual (boolean, not required, whether to resolve files that exist in the Nuxt VFS such as Nuxt templates), fallbackToOriginal (boolean, not required, whether to fallback to the original path if the resolved path does not exist instead of returning the normalized input path).

createResolver function signature

The createResolver function has the signature: function createResolver (basePath: string | URL): Resolver. It creates a resolver relative to a base path. The basePath parameter can be a string or a URL.

createResolver return value properties

The createResolver function returns an object with the following properties: resolve (a function with signature (path: string) => string that resolves a path relative to the base path), resolvePath (a function with signature (path: string, options?: ResolvePathOptions) => Promise<string> that resolves a path relative to the base path and respects Nuxt alias and extensions options).

resolvePath example with headlessui components

import { defineNuxtModule, resolvePath } from '@nuxt/kit' import { join } from 'pathe' const headlessComponents: ComponentGroup[] = [ { relativePath: 'combobox/combobox.js', chunkName: 'headlessui/combobox', exports: [ 'Combobox', 'ComboboxLabel', 'ComboboxButton', 'ComboboxInput', 'ComboboxOptions', 'ComboboxOption', ], }, ] export default defineNuxtModule({ meta: { name: 'nuxt-headlessui', configKey: 'headlessui', }, defaults: { prefix: 'Headless', }, async setup (options) { const entrypoint = await resolvePath('@headlessui/vue') const root = join(entrypoint, '../components') for (const group of headlessComponents) { for (const e of group.exports) { addComponent( { name: e, export: e, filePath: join(root, group.relativePath), chunkName: group.chunkName, mode: 'all', }, ) } } }, }) This example shows how to use resolvePath to resolve a package entrypoint and then dynamically register components from that package.

findPath example resolving app component

import { defineNuxtModule, findPath } from '@nuxt/kit' import { join } from 'pathe' export default defineNuxtModule({ async setup (_, nuxt) { // Resolve main (app.vue) const mainComponent = await findPath([ join(nuxt.options.srcDir, 'App'), join(nuxt.options.srcDir, 'app'), ]) }, }) This example shows how to use findPath to resolve the main app component by checking multiple possible paths.

createResolver example with version detection

import { createResolver, defineNuxtModule, isNuxt2 } from '@nuxt/kit' export default defineNuxtModule({ setup (options, nuxt) { const resolver = createResolver(import.meta.url) nuxt.hook('modules:done', () => { if (isNuxt2()) { addPlugin(resolver.resolve('./runtime/plugin.vue2')) } else { addPlugin(resolver.resolve('./runtime/plugin.vue3')) } }) }, }) This example shows how to use createResolver to resolve paths relative to the module directory and use them conditionally based on the Nuxt version.

Give your agent this brain