功能
Nuxt 的某些功能可选择启用,也可以根据你的需求禁用。
¥Some features of Nuxt are available on an opt-in basis, or can be disabled based on your needs.
features
inlineStyles
渲染 HTML 时内联样式。目前仅在使用 Vite 时可用。
¥Inlines styles when rendering HTML. This is currently available only when using Vite.
你还可以传递一个函数,该函数接收 Vue 组件的路径并返回一个布尔值,指示是否内联该组件的样式。
¥You can also pass a function that receives the path of a Vue component and returns a boolean indicating whether to inline the styles for that component.
export default defineNuxtConfig({
features: {
inlineStyles: false // or a function to determine inlining
}
})
noScripts
禁用 Nuxt 脚本和 JS 资源提示的渲染。也可以在 routeRules
中进行精细配置。
¥Disables rendering of Nuxt scripts and JS resource hints. Can also be configured granularly within routeRules
.
export default defineNuxtConfig({
features: {
noScripts: true
}
})
future
此外,还有一个 future
命名空间,用于提前选择未来(可能是主要)版本中将成为默认版本的框架新功能。
¥There is also a future
namespace for early opting-in to new features that will become default in a future (possibly major) version of the framework.
compatibilityVersion
这允许提前访问 Nuxt 功能或标志。
¥This enables early access to Nuxt features or flags.
将 compatibilityVersion
设置为 4
会更改整个 Nuxt 配置中的默认值,以选择加入 Nuxt v4 行为,但你可以在测试时精细地重新启用 Nuxt v3 行为(参见示例)。如有问题,请提交问题,以便我们在 Nuxt 或生态系统中解决。
¥Setting compatibilityVersion
to 4
changes defaults throughout your
Nuxt configuration to opt-in to Nuxt v4 behaviour, but you can granularly re-enable Nuxt v3 behaviour
when testing (see example). Please file issues if so, so that we can
address in Nuxt or in the ecosystem.
export default defineNuxtConfig({
future: {
compatibilityVersion: 4,
},
// To re-enable _all_ Nuxt v3 behaviour, set the following options:
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 启用 '打包器' 模块解析模式,这是 Nuxt 和 Vite 等框架的推荐设置。
¥This enables 'Bundler' module resolution mode for TypeScript, which is the recommended setting for frameworks like Nuxt and Vite.
它改进了使用现代库与 exports
时的类型支持。
¥It improves type support when using modern libraries with exports
.
请参阅 原始 TypeScript 拉取请求。
¥See the original TypeScript pull request.
export default defineNuxtConfig({
future: {
typescriptBundlerResolution: true
}
})