Vite 构建需显式配置 build.sourcemap 控制 JS 源码映射（true/inline/hidden），CSS 映射则需单独设 css.sourcemap: true 且禁用压缩；生产环境推荐 hidden 模式并上传至 Sentry 后删除本地 .map 文件。

在 Vite 构建时生成源码映射（SourceMap）文件，核心是配置 build.sourcemap 选项，并注意 JS 和 CSS 的行为差异。默认情况下，Vite 生产构建不生成任何 SourceMap，必须显式开启。

JS 源码映射的生成方式

Vite 通过 build.sourcemap 控制 JS 的映射输出，支持三种值：

• true：生成独立的 .js.map 文件，并在 JS 文件末尾添加 //# sourceMappingURL=xxx.js.map 注释
• 'inline'：把完整的 SourceMap 内容 base64 编码后嵌入 JS 文件，不生成额外 .map 文件
• 'hidden'：生成 .map 文件，但不写 sourceMappingURL 注释，浏览器不会自动加载，适合上传到 Sentry 等平台

示例配置（vite.config.ts）：

build: { sourcemap: true }

CSS 源码映射需单独启用

CSS 的 SourceMap 不受 build.sourcemap 影响，且生产环境默认被禁用。要生成 .css.map 文件，必须同时满足：

Java Maven Code Review

审查Java Maven项目（ZIP压缩包或GitLab仓库URL），检查代码规范、命名、模块边界、可维护性问题以及重复代码。

下载

立即学习“Java免费学习笔记（深入）”；

• 设置 css.sourcemap: true（Vite 5+ 推荐写法）
• 关闭 CSS 压缩：cssMinify: false（否则压缩器会主动剥离 .map）

完整 CSS 映射配置示例：

css: { sourcemap: true },
build: { sourcemap: true, cssMinify: false }

生产环境使用注意事项

生成 .map 文件只是第一步，上线前务必确保安全：

• 避免直接将 sourcemap: true 的产物部署到公开 CDN——攻击者可通过 sourceMappingURL 下载全部源码
• 推荐用 sourcemap: 'hidden' 构建，再用 Sentry CLI 上传 .map 并绑定 release 版本
• 上传成功后立即删除本地所有 .map 文件，只发布不含注释、无 .map 的 JS/CSS

验证是否生效

构建完成后检查两处：

• JS 文件末尾是否有 sourceMappingURL= 注释（取决于你选的模式）
• dist 目录下是否存在对应名称的 .js.map 或 .css.map 文件