如何设置VSCode在保存SassScss文件时自动实时编译为CSS？

本文共计1124个文字，预计阅读时间需要5分钟。

能，但必须安装工具、配置路径、避免几个默认失败点——90%的没反应不是插件坏了，而是sass命令根本没装好，或VSCode终端找不到它。

先确认 sass 命令是否可用（最常卡住的环节）

VSCode 所有自动编译方案（插件或任务）都依赖 Dart Sass 引擎。Live Sass Compiler 虽然自带轻量引擎，但很多配置项（比如 includeItems 或某些 watch 行为）仍会 fallback 到系统 sass 命令；tasks.json 更是直接调用它。不验证这一步，后面全白配。

• 在 VSCode 终端（Terminal → New Terminal）中运行 sass --version
• 如果报 command not found：执行 npm install -g sass（别用 node-sass，它已废弃，不支持 @use）
• macOS/Linux 用户装完务必重启 VSCode，否则终端 PATH 可能未刷新
• pnpm 用户检查全局 bin 是否在 $PATH 中（pnpm env use --global 18 后可能需手动加路径）

用 Live Sass Compiler 插件快速启用（适合小项目/学习）

它开箱即用，但默认配置几乎一定不符合你的目录结构。三个配置项不手动改，CSS 就会生成在错地方、没 map、甚至漏编译 _mixins.scss 这类文件。