VS Code中.scss文件声明变量时出现红线如何解决？

• 检查并更新SCSS插件
  先确认你安装的SCSS相关插件（比如SCSS IntelliSense、Live Sass Compiler）是最新版本，旧版本大概率存在语法兼容问题。如果已经装了插件，试试禁用后重新启用，或者直接卸载重装一遍。

• 修正文件关联设置
  有时候VS Code会把.scss文件错误识别为CSS格式，导致变量语法不被认可。按Ctrl+,打开设置，搜索files.associations，添加或修改配置：

  "files.associations": {
    "*.scss": "scss"
  }
  

• 关闭冲突的语法检查
  如果VS Code内置的CSS语法检查对SCSS变量报错，可以在设置里直接禁用SCSS的验证：

  "scss.validate": false
  

  要是想保留CSS文件的验证，只修改scss.validate即可，别改动css.validate。

• 检查项目校验工具配置
  如果你用了stylelint这类代码校验工具，可能是配置规则限制了变量声明方式。去项目根目录找.stylelintrc或类似配置文件，调整相关规则（比如declaration-block-no-duplicate-properties这类容易误判的规则），也可以在报错代码前加/* stylelint-disable */临时跳过校验。

• 重启VS Code清除缓存
  VS Code的缓存偶尔会导致语法识别异常，完全关闭软件（包括后台进程）后重新打开，或者按Ctrl+Shift+P打开命令面板，执行Developer: Reload Window重载窗口。也可以手动删除缓存目录：Windows路径为%APPDATA%\Code\Cache，Mac路径为~/Library/Caches/Code。

内容的提问来源于stack exchange，提问作者Pavan Rayudu