Метаданные import.meta

Поймите, где выполняется код, с помощью `import.meta`.

Объект import.meta

В ES-модулях можно получить метаданные из кода, который импортирует или компилирует ваш модуль. Это делается через import.meta — объект, передающий эту информацию в ваш код. В документации Nuxt вы часто увидите фрагменты, которые с его помощью определяют, выполняется ли код на клиенте или на сервере.

Подробнее о import.meta.

Подробнее о модулях ES в Nuxt — в разделе ESM.

Свойства времени выполнения (приложение)

Эти значения подставляются статически и допускают вырезание мёртвого кода (tree-shaking) в коде времени выполнения.

СвойствоТипОписание
import.meta.clientbooleantrue, если выполняется на клиенте.
import.meta.browserbooleantrue, если выполняется на клиенте.
import.meta.serverbooleantrue, если выполняется на сервере.
import.meta.nitrobooleantrue, если выполняется на сервере.
import.meta.devbooleantrue при работе dev-сервера Nuxt.
import.meta.testbooleantrue в тестовом контексте.
import.meta.prerenderbooleantrue при рендере 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'),
    })
  },
})