导入元数据

使用 `import.meta` 来了解你的代码运行在何处。

import.meta 对象

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

阅读关于 import.meta 的更多信息。

运行时 (App) 属性

这些值是静态注入的，可用于对运行时代码进行 Tree-shaking（摇树优化）。

属性类型描述
import.meta.clientboolean当在客户端计算时为 true。
import.meta.browserboolean当在客户端计算时为 true。
import.meta.serverboolean当在服务端计算时为 true。
import.meta.nitroboolean当在服务端计算时为 true。
import.meta.devboolean当运行 Nuxt 开发服务器时为 true。
import.meta.testboolean当在测试环境中运行时为 true。
import.meta.prerenderboolean当在构建的预渲染阶段于服务端渲染 HTML 时为 true。

构建器属性

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

属性类型描述
import.meta.env对象等同于 process.env
import.meta.urlstring当前文件的可解析路径。

示例

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

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

// Resolve relative from the current file
const resolver = createResolver(import.meta.url)

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