Import meta
Comprende dónde se está ejecutando tu código usando import.meta.
El objeto import.meta
Con los módulos ES puedes obtener algunos metadatos del código que importa o compila tu módulo ES.
Esto se hace a través de import.meta
, que es un objeto que proporciona esta información a tu código.
A lo largo de la documentación de Nuxt, puedes ver fragmentos que ya utilizan esto para determinar si el
código se está ejecutando actualmente en el lado del cliente o del servidor.
Propiedades de Runtime (App)
Estos valores se inyectan estáticamente y pueden usarse para optimizar tu código de runtime.
Propiedad | Tipo | Descripción |
---|---|---|
import.meta.client | booleano | Verdadero cuando se evalúa en el lado del cliente. |
import.meta.browser | booleano | Verdadero cuando se evalúa en el lado del cliente. |
import.meta.server | booleano | Verdadero cuando se evalúa en el lado del servidor. |
import.meta.nitro | booleano | Verdadero cuando se evalúa en el lado del servidor. |
import.meta.dev | booleano | Verdadero cuando se ejecuta el servidor de desarrollo de Nuxt. |
import.meta.test | booleano | Verdadero cuando se ejecuta en un contexto de prueba. |
import.meta.prerender | booleano | Verdadero cuando se renderiza HTML en el servidor en la etapa de prerenderizado de tu build. |
Propiedades del Constructor
Estos valores están disponibles tanto en los módulos como en tu nuxt.config
.
Propiedad | Tipo | Descripción |
---|---|---|
import.meta.env | objeto | Equivale a process.env |
import.meta.url | cadena | Ruta resoluble para el archivo actual. |
Ejemplos
Usando import.meta.url
para resolver archivos dentro de módulos
import { createResolver } from 'nuxt/kit'
// Resolver relativo desde el archivo actual
const resolver = createResolver(import.meta.url)
export default defineNuxtModule({
meta: { name: 'myModule' },
setup() {
addComponent({
name: 'MyModuleComponent',
// Se resuelve a '/modules/my-module/components/MyModuleComponent.vue'
filePath: resolver.resolve('./components/MyModuleComponent.vue')
})
}
})
※Esta página es una traducción no oficial de la documentación oficial de Nuxt.js.
La página correspondiente en la documentación oficial está aquí:
https://nuxt.com/docs/3.x/api/advanced/import-meta