# 选项参考
# transformAssetUrls
类型:
{ [tag: string]: string | Array<string> }
默认
{ video: ['src', 'poster'], source: 'src', img: 'src', image: ['xlink:href', 'href'], use: ['xlink:href', 'href'] }
在模板编译期间,编译器可以转换某些属性,例如
src
URL,为require
调用,以便 webpack 可以处理目标资产。例如,<img src="./foo.png">
将尝试在您的文件系统上找到文件./foo.png
并将其作为您捆绑包的依赖项包含在内。
# compiler
类型:
VueTemplateCompiler
默认:
require('vue-template-compiler')
覆盖用于编译单文件组件中
<template>
块的默认编译器。
# compilerOptions
类型:
Object
默认:
{}
模板编译器的选项。当使用默认的
vue-template-compiler
时,您可以使用此选项添加自定义编译指令、模块,或使用{ preserveWhitespace: false }
丢弃模板标签之间的空格。
# transpileOptions
类型:
Object
默认:
{}
配置 ES2015+ 到 ES5 的转换选项,用于生成的渲染函数代码。该 转换器 是 Buble 的一个分支,因此请参考可用的选项 此处.
模板渲染函数编译支持一个特殊的转换
stripWith
(默认启用),它会删除生成的渲染函数中的with
使用,使其符合严格模式。
# optimizeSSR
类型:
boolean
默认: 当 webpack 配置具有
target: 'node'
且vue-template-compiler
版本为 2.4.0 或更高版本时为true
。启用 Vue 2.4 SSR 编译优化,该优化将渲染函数返回的 vdom 树的一部分编译为纯字符串,从而提高 SSR 性能。在某些情况下,您可能希望明确关闭它,因为生成的渲染函数只能用于 SSR,不能用于客户端渲染或测试。
# hotReload
类型:
boolean
默认: 在开发模式下为
true
,在生产模式下或当 webpack 配置具有target: 'node'
时为false
。允许值:
false
(true
不会在生产模式下或当target: 'node'
时强制热重载)是否使用 webpack 热模块替换 在浏览器中应用更改 **而无需重新加载页面**。使用此选项(值
false
)在开发模式下禁用热重载功能。
# productionMode
- 类型:
boolean
- 默认:
process.env.NODE_ENV === 'production'
强制生产模式,这将禁止加载器发出仅开发的代码(例如热重载相关代码)。
# shadowMode
- 类型:
boolean
- 默认:
false
编译组件以在 Shadow DOM 中使用。在此模式下,组件的样式将被注入到 this.$root.$options.shadowRoot
而不是文档头部。
# cacheDirectory / cacheIdentifier
- 类型:
string
- 默认:
undefined
当两个选项都指定时,启用基于文件系统的模板编译缓存(需要在同一个项目中安装 cache-loader
)。
提示
vue-loader
和 cache-loader
之间的交互使用 内联加载器导入语法 在钩子下,!
将被视为不同加载器之间的分隔符,因此请确保 cacheDirectory
不包含 !
。
# prettify
- 类型:
boolean
- 默认: 如果安装了 prettier v1 或 v2,则为
true
,否则为false
在开发模式下,我们使用 prettier 默认情况下格式化编译后的渲染函数,以便于调试。但是,如果您遇到 prettier 的任何奇怪错误,例如 深度嵌套函数的指数级编译时间,您可以禁用此选项来规避它。
# exposeFilename
- 类型:
boolean
- 默认:
false
在非生产环境中,vue-loader 会为组件注入 __file
属性,以获得更好的调试体验。如果组件中缺少 name
属性,Vue 将从 __file
字段推断它,以在控制台警告中显示。
默认情况下,此属性在生产构建中被剥离。但是,如果您正在开发组件库并且不想在每个组件中都指定 name
,您可能希望保留它。然后您可以打开此选项。