<p>SCSS中//单行注释不会出现在最终CSS里，因其在解析阶段即被完全剥离，不参与AST构建；而/ /块注释虽由SCSS保留，但是否留存取决于后续构建工具（如cssnano）的配置。</p>
SCSS 中的 // 单行注释不会出现在最终 CSS 里，这是确定行为；如果你看到压缩后的 CSS 里还有注释，那一定是 /* */ 块注释，且它没被后续构建工具（如 cssnano、css-minimizer-webpack-plugin）删掉。
为什么 // 注释从不进 CSS
// 是 SCSS 源码级注释，只存在于编译前，解析阶段就被完全剥离。它不参与 AST 构建，也不生成任何 CSS 节点——不是“被压缩掉了”，而是压根没被翻译进去。
常见误操作：
- 在
.btn { // 主色按钮 }里加//，期望上线后能查上下文 → 实际 CSS 里连空格都不会多一个 - 用
// margin: 0;临时禁用某行 → 编译后该样式照常输出，因为//只屏蔽了这一行的解析，不影响其他声明
正确用途：仅用于开发时逻辑开关、调试占位、临时跳过某段 @include 或 @if 分支。
立即学习“前端免费学习笔记（深入）”；
/* */ 注释为何还在压缩后 CSS 里
/* */ 是标准 CSS 注释，SCSS 默认保留它，但是否最终留在生产 CSS 中，取决于后续构建环节：
-
css-minimizer-webpack-plugin默认开启dropComments: true，会删所有/* */ - 但若配置了
preserveComments: /v\d+\.\d+\.\d+|Copyright/，匹配到的注释就会被强制保留 - Vite 的
build.minify: 'esbuild'模式下，esbuild不处理 CSS，注释可能意外残留（因未走 PostCSS 链路） - 某些旧版
lessc（非 SCSS）会优化掉孤立的/* @{version} */，但 Dart Sass 不会
验证方法：直接打开生成的 .css 文件末尾，看是否有 /* v1.2.0 */ 这类内容；若有，说明构建流程中某个环节显式保留了它。
如何确保关键注释不泄漏，又不被误删
核心原则：注释是否保留，不由 SCSS 控制，而由你配置的压缩器决定。
- 业务说明、模块分隔、兼容性提示等，一律不用注释承载——改用文档或代码结构表达
- 必须保留的版权或版本信息，用正则精准匹配：
preserveComments: /Copyright|MIT|v\d+\.\d+\.\d+/ - 避免写
/* TODO: refactor */这类开发期注释——它们本就不该进生产环境 - 如果用了
postcss-preset-env或自定义 PostCSS 插件，确认它没在 cssnano 前一步就把注释清空了
最容易被忽略的一点：Webpack/Vite 中的 CSS 压缩插件，往往默认只对 .css 文件生效；如果你的 SCSS 输出路径是 dist/style.scss.css 或带 hash 的文件名，可能根本没被匹配到，注释就原样留下了。
