必须显式加 --source-map（或 --embed-source-map）才能生成 source map，dart sass 1.50+ 默认关闭；webpack 需 sass-loader、mini-css-extract-plugin 和 devtool 三处同时启用 sourcemap；vite 需 css.devsourcemap 和 css.preprocessoroptions.sass.sourcemap 双启用，并注意路径与压缩配置。
必须显式加 --source-map（或 --sourcemap），否则 Dart Sass 默认不生成任何 source map 文件，浏览器里点样式永远跳不到 .scss 源码行。
命令行编译必须带 --source-map 参数
从 Sass CLI 1.50+ 开始，--source-map 默认关闭。只写 sass input.scss output.css 不会生成 .css.map，也不会报错、不会警告——它就安静地只输出 CSS。
-
sass src/main.scss dist/main.css --source-map：生成独立的main.css.map文件（推荐开发用） -
sass src/main.scss dist/main.css --embed-source-map：把 map 内容 base64 编码后塞进 CSS 底部（体积大，仅适合快速验证） -
--source-map必须和输入/输出路径写在同一命令中；单独写sass --source-map main.scss会报错 - Dart Sass 不再支持
--sourcemap=inline这种旧写法，只认--embed-source-map
Webpack 中要三处同时配 sourceMap: true
只在 sass-loader 里开 sourceMap 是不够的——CSS 提取插件（如 mini-css-extract-plugin）和 Webpack 自身的 devtool 都得对齐，否则最终 CSS 文件里没有 /*# sourceMappingURL= */ 注释，浏览器直接失效。
-
sass-loader的options.sourceMap设为true -
mini-css-extract-plugin的options.sourceMap也设为true - Webpack
devtool推荐用"source-map"或"eval-source-map"；避免用"cheap-module-source-map"，它会丢原始行号 - 别用已停更的
node-sass，确保sass-loader的implementation指向require('sass')（即 Dart Sass）
Vite 需同时开启两层配置
Vite 把 source map 拆成预处理器层和 CSS 处理层，漏掉任一环，.css.map 就不会出现——哪怕你开了 build.sourcemap: true，那也只是管 JS 的。
-
css.devSourcemap: true：控制 CSS 层（PostCSS、@import 变基等）的映射链路 -
css.preprocessorOptions.sass.sourceMap: true：告诉 Dart Sass 在编译 SCSS 时生成 map 数据（默认是false） - 生产构建时，
build.cssMinify必须设为false，否则压缩过程会抹掉.css.map - 如果用了
css.preprocessorOptions.sass自定义配置，记得手动补上sourceMap: true，Vite 不会自动继承
最容易被忽略的是路径问题：生成的 .css.map 文件里 sources 字段若含绝对路径（如 /Users/me/project/src/button.scss）或错误相对路径，浏览器就找不到源文件。开发时建议加 --source-map-include-sources 把源码直接嵌入 map，跳过路径解析环节。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
