nuxt logo

Traducción de Documentación (No Oficial)

Características

Habilita o deshabilita características opcionales de Nuxt para desbloquear nuevas posibilidades.

Algunas características de Nuxt están disponibles de manera opcional, o pueden ser deshabilitadas según tus necesidades.

features

inlineStyles

Incluye estilos en línea al renderizar HTML. Esto está disponible actualmente solo cuando se utiliza Vite.

También puedes pasar una función que reciba la ruta de un componente Vue y devuelva un booleano indicando si se deben incluir los estilos en línea para ese componente.

nuxt.config.ts
export default defineNuxtConfig({
  features: {
    inlineStyles: false // o una función para determinar la inclusión en línea
  }
})

noScripts

Deshabilita la renderización de scripts de Nuxt y sugerencias de recursos JS. También se puede configurar de manera granular dentro de routeRules.

nuxt.config.ts
export default defineNuxtConfig({
  features: {
    noScripts: true
  }
})

future

También hay un espacio de nombres future para optar anticipadamente por nuevas características que se convertirán en predeterminadas en una futura (posiblemente mayor) versión del framework.

compatibilityVersion

Esta opción de configuración está disponible en Nuxt v3.12+. Por favor, ten en cuenta que, por ahora, necesitas definir la versión de compatibilidad en cada capa que opte por el comportamiento de Nuxt 4. Esto no será necesario después del lanzamiento de Nuxt 4.

Esto permite el acceso anticipado a características o banderas de Nuxt.

Configurar compatibilityVersion a 4 cambia los valores predeterminados en toda tu configuración de Nuxt para optar por el comportamiento de Nuxt v4, pero puedes volver a habilitar granularmente el comportamiento de Nuxt v3 al probar (ver ejemplo). Por favor, presenta problemas si es así, para que podamos abordarlos en Nuxt o en el ecosistema.

export default defineNuxtConfig({
  future: {
    compatibilityVersion: 4,
  },
  // Para volver a habilitar _todo_ el comportamiento de Nuxt v3, configura las siguientes opciones:
  srcDir: '.',
  dir: {
    app: 'app'
  },
  experimental: {
    scanPageMeta: 'after-resolve',
    sharedPrerenderData: false,
    compileTemplate: true,
    resetAsyncDataToUndefined: true,
    templateUtils: true,
    relativeWatchPaths: true,
    normalizeComponentNames: false
    defaults: {
      useAsyncData: {
        deep: true
      }
    }
  },
  features: {
    inlineStyles: true
  },
  unhead: {
    renderSSRHeadOptions: {
      omitLineBreaks: false
    }
  }
})

typescriptBundlerResolution

Esto habilita el modo de resolución de módulos 'Bundler' para TypeScript, que es la configuración recomendada para frameworks como Nuxt y Vite.

Mejora el soporte de tipos al usar bibliotecas modernas con exports.

Consulta la solicitud de extracción original de TypeScript.

nuxt.config.ts
export default defineNuxtConfig({
  future: {
    typescriptBundlerResolution: true
  }
})