v3
GitHub

特性

启用或禁用可选的 Nuxt 特性以解锁新的可能性。

Nuxt 的一些特性是基于选择性开启，或者可以根据您的需求禁用。

features

inlineStyles

在渲染 HTML 时内联样式。目前仅在使用 Vite 时可用。

您也可以传递一个函数，该函数接收 Vue 组件的路径，并返回一个布尔值，表示是否为该组件内联样式。

nuxt.config.ts
export default defineNuxtConfig({
  features: {
    inlineStyles: false // 或者一个用于决定是否内联的函数
  }
})

noScripts

禁用 Nuxt 脚本和 JavaScript 资源提示的渲染。也可以在 routeRules 中进行细粒度配置。

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

future

还有一个 future 命名空间，用于提前选择即将在将来（可能是重大）版本中成为默认的新特性。

compatibilityVersion

该配置项仅在 Nuxt v3.12+ 中可用。请注意，目前您需要在每个选择启用 Nuxt 4 行为的层中定义兼容版本。Nuxt 4 发布后将不再需要这样做。

此配置允许提前访问 Nuxt 的新特性或标记。

将 compatibilityVersion 设置为 4 会改变您整个 Nuxt 配置的默认值，以选择启用 Nuxt v4 行为，但您可以在测试时细粒度地重新启用 Nuxt v3 行为（见示例）。如果遇到问题，请提出 issue，方便我们在 Nuxt 或其生态中解决。

export default defineNuxtConfig({
  future: {
    compatibilityVersion: 4,
  },
  // 若要重新启用 _所有_ Nuxt v3 行为，请设置以下选项：
  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

此配置启用 TypeScript 的「Bundler」模块解析模式，这是针对 Nuxt 和 Vite 等框架的推荐设置。

它增强了使用带有 exports 的现代库时的类型支持。

详见 TypeScript 原始 pull request。

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