导入 meta

使用 `import.meta` 了解代码运行的位置。

import.meta 对象

通过 ES 模块,你可以从导入或编译你的 ES 模块的代码中获取一些元数据。
这通过 import.meta 实现,它是一个为你的代码提供这些信息的对象。
在 Nuxt 文档中,你可能已经看到一些代码片段使用它来判断代码当前是在客户端还是服务端运行。

阅读更多关于 import.meta 的内容。

运行时(应用)属性

这些值是静态注入的,可用于对运行时代码进行树摇优化。

属性类型说明
import.meta.clientboolean在客户端评估时为真。
import.meta.browserboolean在客户端评估时为真。
import.meta.serverboolean在服务器端评估时为真。
import.meta.nitroboolean在服务器端评估时为真。
import.meta.devboolean在运行 Nuxt 开发服务器时为真。
import.meta.testboolean在测试环境中运行时为真。
import.meta.prerenderboolean在构建的预渲染阶段服务器端渲染 HTML 时为真。

构建器属性

这些值在模块和你的 nuxt.config 中都可用。

属性类型说明
import.meta.envobject等同于 process.env
import.meta.urlstring当前文件的可解析路径。

示例

使用 import.meta.url 解析模块内文件

modules/my-module/index.ts
import { createResolver } from 'nuxt/kit'

// 从当前文件相对解析
const resolver = createResolver(import.meta.url)

export default defineNuxtModule({
  meta: { name: 'myModule' },
  setup() {
    addComponent({
      name: 'MyModuleComponent',
      // 解析到 '/modules/my-module/components/MyModuleComponent.vue'
      filePath: resolver.resolve('./components/MyModuleComponent.vue')
    })
  }
})