Live Sass Compiler插件装完不会自动工作，必须手动点击“Watch Sass”按钮或配置settings.json启用监听，否则保存.scss文件无反应；常见原因包括未开启监听、formats路径错误、文件编码含BOM、与sass --watch冲突、工作区未正确打开，且插件不支持@use/@forward语法。
Live Sass Compiler 插件装完不会自动工作，必须手动开启监听或配置好 settings.json，否则保存 .scss 文件毫无反应。
Live Sass Compiler 为什么保存后不生成 CSS
最常见原因是没启用监听模式，插件默认不自动 watch 任何文件。它不是“装完即用”，而是“装完需点一下”。另外几个关键点：
-
liveSassCompile.settings.formats配置缺失或路径写错，会导致 CSS 被输出到奇怪位置（比如项目根目录、甚至上级目录） - 文件编码含 BOM（如 UTF-8 with BOM），插件解析失败且不报错，静默跳过编译
- 项目里同时运行着
sass --watch，两个进程争抢写同一个.css文件，尤其 Windows 下容易写空或损坏 - 工作区未正确打开——插件只对当前 VSCode 工作区根目录及其子目录下的
.scss文件生效
如何正确配置 settings.json 控制输出位置
在项目根目录建 .vscode/settings.json，填入明确的 formats 和 generateMap，不要依赖默认值：
{
"liveSassCompile.settings.formats": [
{
"format": "expanded",
"extensionName": ".css",
"savePath": "/css/"
}
],
"liveSassCompile.settings.generateMap": true,
"liveSassCompile.settings.autoSaveWatchedFiles": true
}
注意：savePath 是相对路径，以项目根为起点；/css/ 表示输出到 ./css/ 目录；若写成 css（无斜杠），部分版本会误判为文件名前缀。
右下角 “Watch Sass” 按钮点不动或没出现
先确认插件已启用、VSCode 已重启，并且你正编辑的是 .scss 或 .sass 文件（不是 .css 或纯文本）。如果按钮始终不显示：
- 按
Ctrl+Shift+P（Windows/Linux）或Cmd+Shift+P（macOS），输入Live Sass: Watch My Sass手动触发 - 检查状态栏右下角是否已显示
Live Sass Compiler Active—— 没这个标识说明监听根本没起来 - 打开一个
.scss文件再试，插件有时只在有匹配文件打开时才激活 UI 元素
想用官方 sass CLI 替代插件怎么办
当 Live Sass Compiler 在复杂项目中行为不稳定（比如不识别 @use、map 错位、多入口混乱），直接切到官方 Dart Sass 更可靠：
- 先确保终端能运行
sass --version；不行就npm install -g sass - 在终端执行：
sass --watch src/scss/main.scss:dist/css/main.css --style=compressed --source-map - 或配成 VSCode 任务：在
.vscode/tasks.json里定义 shell 类型任务，args填上上述参数 - 注意：插件和 CLI 别共存，关掉
Watch Sass再起sass --watch，避免冲突
真正容易被忽略的是：插件不支持 @use 和 @forward（Dart Sass 2021 年起的推荐语法），一旦 SCSS 里用了这些，编译会直接失败且只报“syntax error”，不提示具体哪行——这时候别调配置，换 CLI 就对了。
