vscode本身不编译sass或less，所有“自动编译”均依赖本地安装的sass或lessc命令行工具；90%失败源于未正确安装或path未配置，须在系统原生命令行运行sass --version或lessc --version验证版本号，再配合live sass compiler（sass）或tasks.json（less）实现编译。
VSCode 本身不编译 Sass 或 Less，所谓“自动编译”只是调用你本地装好的 sass 或 lessc 命令行工具；90% 的“保存没反应”问题，根源都在这一步没走通。
确认 sass 或 lessc 已全局可用
插件和 tasks.json 都不会报错，只会静默跳过——你得先在系统原生命令行（不是 VSCode 内置终端）里验证：
- 运行
sass --version，看到类似1.77.6的输出才算成功；node-sass已废弃，别用 - 运行
lessc --version，应返回4.2.0或更高；Easy LESS 插件依赖它，但自己不装，它就彻底失能 - Windows 用户检查
%APPDATA%\npm是否在系统 PATH 中；macOS/Linux 用户若用pnpm或yarn，需手动把其全局 bin 路径（如~/.local/share/pnpm）加进$PATH - 装完务必重启 VSCode，否则终端可能仍找不到命令
Live Sass Compiler 插件只对 SCSS/Sass 有效，且配置必须放项目根目录
它不处理 Less，也不读取用户全局设置，所有配置只认项目根目录下的 .vscode/settings.json：
- 文件名以下划线开头（如
_mixins.scss）默认不编译，要显式加进liveSassCompile.settings.includeItems，例如["**/_mixins.scss"] -
"savePath": "/css/"是相对项目根目录的路径，不是相对当前文件；写成"~/../css/"会被忽略 - 右下角状态栏必须显示你期望的项目根路径；多文件夹工作区下，它只监听第一个文件夹
- 文件编码必须是 UTF-8（不含 BOM），否则静默跳过；右下角点编码 → “Save with Encoding” → 选 UTF-8
tasks.json 调用 lessc 或 sass 是最稳方案
绕过插件，直接控制 CLI 行为，避免监听失效、路径解析错误、@import 失败等新版 VSCode（v1.80+）常见问题：
- Less：在
.vscode/tasks.json中必须设"isBackground": true，否则任务执行完就退出，无法持续监听 - Less：路径变量要用
${file}和${fileDirname}/${fileBasenameNoExtension}.css，手写死路径容易跨平台出错 - Sass：
sass --watch src/scss/:dist/css/这种目录映射写法更可靠；Windows 下反斜杠\易被解析失败，统一用正斜杠/ - 如果
@import引用了别名路径（如@import "base/typo"），Less 需加--include-path=src/less，Sass 对应用--load-path=src/scss
Vite 项目里别折腾 VSCode 插件
Vite 原生支持 .scss 和 .less，import 即编译，source map、HMR、模块作用域全内置：
- 删掉所有 Live Sass Compiler、Easy LESS 等插件，它们不仅多余，还可能和 Vite 的 watch 冲突，导致 CSS 不更新或热更新卡住
- 需要类型提示？用
vite-plugin-sass-dts生成声明文件，而不是靠插件模拟编译 - 真正难调的从来不是“怎么配”，而是路径解析歧义、
@use模块加载顺序、WSL/OneDrive 文件节流、以及不同终端（PowerShell/cmd/Git Bash）对 shell 参数的解析差异——这些都不会报红，但会让你改了十次都看不到 CSS 变化
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
