导入 meta

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

import.meta 对象

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

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

运行时（应用）属性

这些值是静态注入的，可用于对运行时代码进行摇树优化（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.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'),
    })
  },
})