全部学科
Python全栈
python
NodeJS全栈
nodejs
小程序首页
📅 2026-05-23 5 分钟 ✍️ juanwangdev

Source Map 生成策略

Source Map 用于调试,将压缩代码映射回源码位置。

配置选项

JavaScript
export default defineConfig({
  build: {
    sourcemap: false  // 不生成(默认)
  }
})
选项值说明
false不生成 source map
true生成独立 .map 文件
'inline'内联到文件中
'hidden'生成但不关联

生成独立文件

JavaScript
export default defineConfig({
  build: {
    sourcemap: true
  }
})

构建输出:

JavaScript
dist/
├── index-abc.js
├── index-abc.js.map

内联 Source Map

JavaScript
export default defineConfig({
  build: {
    sourcemap: 'inline'
  }
})

source map 内联到 JS 文件末尾,不生成独立文件。

注意:内联方式会增加 JS 文件体积。

Hidden Source Map

JavaScript
export default defineConfig({
  build: {
    sourcemap: 'hidden'
  }
})

生成 .map 文件但不添加映射链接,用于错误上报分析。

Source Map 作用

场景推荐配置
生产部署false 或 hidden
开发调试true 或 inline
错误监控hidden

体积影响

配置体积增加
false
true+.map 文件
inlineJS 文件增大
hidden+.map 文件

开发环境 Source Map

开发环境默认支持 source map,无需配置:

text
export default defineConfig({
  server: {
    // 开发环境已支持
  }
})

要点总结

  • sourcemap 控制源映射生成
  • true 生成独立 .map 文件
  • inline 内联到文件中
  • hidden 生成但不关联,用于监控

📝 发现内容有误?点击此处直接编辑

← 上一篇 Chunk 大小警告处理
下一篇 → 代码分割策略
想查看更多题目和详细解析?
小程序提供完整的题库、模拟考试和详细解析
马上就来

长按或扫描二维码,立即体验

扫码体验小程序
马上就来
使用微信扫描二维码
立即体验完整题库