Vite 中 SourceMap 由 build.sourcemap 控制,可设为 false、true、“inline”或“hidden”,仅影响构建阶段;开发环境默认启用 cheap-module-source-map 且不输出文件。

在 Vite 中,SourceMap 的控制是通过 build.sourcemap 配置项实现的,不是顶层的 sourcemap 属性(该属性不存在于 Vite 的配置结构中)。这个选项决定是否为构建产物生成 SourceMap 文件,并可指定其生成方式。
build.sourcemap 可设为以下值
-
false:完全禁用 SourceMap(默认开发环境不生效,但生产构建时默认为false) -
true:生成独立的.js.map文件(如index.js对应index.js.map) -
"inline":将 SourceMap 以 base64 形式内联到.js文件末尾(增大 JS 体积,调试方便) -
"hidden":生成.js.map文件,但不在 JS 中加sourceMappingURL注释(浏览器不会自动加载,可用于手动调试或错误监控)
// vite.config.js
export default {
build: {
sourcemap: true // 或 'inline'、'hidden'、false
}
}开发环境(serve)默认已有 SourceMap
Vite 的开发服务器(vite dev)默认启用 SourceMap,且使用 cheap-module-source-map(快速生成、包含行信息但不包含列信息),无需额外配置。它只存在于内存中,不输出文件。
⚠️ 注意:
build.sourcemap仅影响vite build构建阶段,对开发服务器无影响。
生产构建时常见组合建议
- 调试/内部发布:用
"inline"—— 方便直接打开 HTML 就能调试,无需部署 map 文件 - 正式上线:用
true(推荐)—— 分离 map 文件,便于错误监控平台(如 Sentry)上传解析,同时避免 JS 体积膨胀 - 安全敏感场景:用
false或"hidden"—— 避免源码轻易被还原(但不能完全防逆向)
// 示例:仅在非生产环境生成内联 SourceMap
build: {
sourcemap: process.env.NODE_ENV === 'production' ? 'hidden' : 'inline'
}配合其他构建选项使用
SourceMap 生成受 build.minify 和 build.terserOptions 影响:
- 若关闭压缩(
minify: false),SourceMap 更准确,映射更直观 - 若启用
terser压缩,默认仍会生成可用 SourceMap,但需确保terserOptions.sourceMap不被覆盖(Vite 已内部处理)
无需手动配置 Terser 的 sourceMap,Vite 会根据 build.sourcemap 自动协调。
验证是否生效
构建后检查 dist/ 目录:
- 有
.js.map文件 →sourcemap: true或'hidden' -
.js文件末尾含sourceMappingURL=data:application/json;base64,...→sourcemap: 'inline' - 既无 map 文件也无注释 →
sourcemap: false
不复杂但容易忽略


















