diff --git a/docs/content/2.guide/1.concepts/4.auto-imports.md b/docs/content/2.guide/1.concepts/4.auto-imports.md index 0e5b6d8a963..9100d2f262d 100644 --- a/docs/content/2.guide/1.concepts/4.auto-imports.md +++ b/docs/content/2.guide/1.concepts/4.auto-imports.md @@ -55,3 +55,17 @@ Nuxt exposes every auto-import with the `#imports` alias that can be used to mak const double = computed(() => count.value * 2) ``` + +## Disable Auto-imports + +In case you want to disable auto-imports, you can set `imports.autoImport` to `false`. + +```ts [nuxt.config.ts] +export default defineNuxtConfig({ + imports: { + autoImport: false + } +}) +``` + +This will disable implicit auto imports completely but it's still possible to use [Explicit Imports](#explicit-imports). diff --git a/packages/nuxt/src/imports/module.ts b/packages/nuxt/src/imports/module.ts index ef6387adc8a..07eb758ce12 100644 --- a/packages/nuxt/src/imports/module.ts +++ b/packages/nuxt/src/imports/module.ts @@ -12,6 +12,7 @@ export default defineNuxtModule>({ configKey: 'imports' }, defaults: { + autoImport: true, presets: defaultPresets, global: false, imports: [], @@ -55,7 +56,7 @@ export default defineNuxtModule>({ imports: options.imports, virtualImports: ['#imports'], addons: { - vueTemplate: true + vueTemplate: options.autoImport } }) @@ -113,7 +114,7 @@ export default defineNuxtModule>({ await regenerateImports() // Generate types - addDeclarationTemplates(ctx) + addDeclarationTemplates(ctx, options) // Add generated types to `nuxt.d.ts` nuxt.hook('prepare:types', ({ references }) => { @@ -135,7 +136,7 @@ export default defineNuxtModule>({ } }) -function addDeclarationTemplates (ctx: Unimport) { +function addDeclarationTemplates (ctx: Unimport, options: Partial) { const nuxt = useNuxt() // Remove file extension for benefit of TypeScript @@ -163,6 +164,10 @@ function addDeclarationTemplates (ctx: Unimport) { addTemplate({ filename: 'types/imports.d.ts', - getContents: () => '// Generated by auto imports\n' + ctx.generateTypeDeclarations({ resolvePath: r }) + getContents: () => '// Generated by auto imports\n' + ( + options.autoImport + ? ctx.generateTypeDeclarations({ resolvePath: r }) + : '// Implicit auto importing is disabled, you can use explicitly import from `#imports` instead.' + ) }) } diff --git a/packages/nuxt/src/imports/transform.ts b/packages/nuxt/src/imports/transform.ts index 27c4ed552a3..9751614e237 100644 --- a/packages/nuxt/src/imports/transform.ts +++ b/packages/nuxt/src/imports/transform.ts @@ -44,7 +44,7 @@ export const TransformPlugin = createUnplugin(({ ctx, options, sourcemap }: { ct return } - const { s } = await ctx.injectImports(code, id, { autoImport: !isNodeModule }) + const { s } = await ctx.injectImports(code, id, { autoImport: options.autoImport && !isNodeModule }) if (s.hasChanged()) { return { code: s.toString(), diff --git a/packages/schema/src/types/imports.ts b/packages/schema/src/types/imports.ts index cf416685a48..d3d954328dc 100644 --- a/packages/schema/src/types/imports.ts +++ b/packages/schema/src/types/imports.ts @@ -1,7 +1,25 @@ import { UnimportOptions } from 'unimport' export interface ImportsOptions extends UnimportOptions { + /** + * Enable implicit auto import from Vue, Nuxt and module contributed utilities. + * Generate global TypeScript definitions. + * + * @default true + */ + autoImport?: boolean + /** + * Directories to scan for auto imports. + * + * @see https://v3.nuxtjs.org/guide/directory-structure/composables/#how-files-are-scanned + * @default ['./composables'] + */ dirs?: string[] + /** + * Assign auto imported utilities to `globalThis` instead of using built time transformation. + * + * @default false + */ global?: boolean transform?: { exclude?: RegExp[]