Nuxt 3 已于 31 July 2026 结束生命周期
此版本将不再接收错误修复或安全补丁。 升级到 Nuxt 4 或获取 HeroDevs 提供的延长支持

自动导入

源码
Nuxt Kit 提供了一组实用工具，帮助你使用自动导入。这些函数允许你注册自己的工具函数、组合函数和 Vue API。

Maschinelle Übersetzung ·0 % geprüft

Nuxt 自动导入帮助函数、组合函数和 Vue API，使你可以在整个应用中使用它们，无需显式导入。基于目录结构，每个 Nuxt 应用也可以为自己的组合函数和插件使用自动导入。

使用 Nuxt Kit 你还可以添加自己的自动导入。addImports 和 addImportsDir 允许你向 Nuxt 应用添加导入。addImportsSources 允许你从第三方包添加列出的导入到 Nuxt 应用。

这些工具由 unimport 提供支持，它是 Nuxt 中使用的底层自动导入机制。

这些函数用于注册你自己的工具函数、组合函数和 Vue API。对于页面、组件和插件，请参阅相应章节：页面、组件、插件。
观看 Vue School 关于 Nuxt Kit 自动导入实用工具的视频。

addImports

向 Nuxt 应用添加导入。它会使你的导入在 Nuxt 应用上下文中可用，无需手动导入。

要为 Nitro 服务器上下文添加导入，请参阅 addServerImports 函数。

用法

import { addImports, defineNuxtModule } from '@nuxt/kit'

export default defineNuxtModule({
  setup (options, nuxt) {
    const names = [
      'useStoryblok',
      'useStoryblokApi',
      'useStoryblokBridge',
      'renderRichText',
      'RichTextSchema',
    ]

    names.forEach(name =>
      addImports({ name, as: name, from: '@storyblok/vue' }),
    )
  },
})

类型

function addImports (imports: Import | Import[]): void

参数

imports：一个对象或对象数组，包含以下属性：

属性类型必填描述
namestringtrue需要被检测的导入名称。
fromstringtrue导入的模块标识符。
prioritynumberfalse导入的优先级；如果多个导入具有相同名称，则使用优先级最高的。
disabledbooleanfalse是否禁用此导入。
metaRecord<string, any>false导入的元数据。
typebooleanfalse是否为纯类型导入。
typeFromstringfalse生成类型声明时使用的 from 值。
asstringfalse以此名称导入。

addImportsDir

向 Nuxt 应用从目录添加导入。它会自动导入目录中的所有文件，使它们在 Nuxt 应用中可用，无需手动导入。

用法

import { addImportsDir, createResolver, defineNuxtModule } from '@nuxt/kit'

export default defineNuxtModule({
  meta: {
    name: '@vueuse/motion',
    configKey: 'motion',
  },
  setup (options, nuxt) {
    const resolver = createResolver(import.meta.url)
    addImportsDir(resolver.resolve('./runtime/composables'))
  },
})

类型

function addImportsDir (dirs: string | string[], options?: { prepend?: boolean }): void

参数

属性类型必填描述
dirsstring | string[]true字符串或字符串数组，指定要导入的目录路径。
options{ prepend?: boolean }false导入时的选项。如果 prepend 设置为 true，导入会被添加到导入列表的前面。

addImportsSources

向 Nuxt 应用添加列出的导入。

用法

import { addImportsSources, defineNuxtModule } from '@nuxt/kit'

export default defineNuxtModule({
  setup () {
    addImportsSources([
      { package: '@vueuse/core' },
      {
        from: 'h3',
        imports: [
          'defineEventHandler',
          'getQuery',
          'getRouterParams',
          'readBody',
          'sendRedirect',
        ],
      },
    ])
  },
})

类型

function addImportsSources (importSources: Preset | Preset[]): void

参数

importSources：一个对象或对象数组，包含以下属性：

  • InlinePreset
属性类型必填描述
fromstringtrue要从中导入的模块说明符（specifier）。
importsPresetImport | ImportSource[]true一个对象或对象数组，可以是导入名称、导入对象或导入源。
  • PackagePreset
属性类型必填描述
packagestringtrue包的名称。