WebStorm 2021.2中SCSS文件Stylelint失效，如何指定文件扩展名？

一、配置WebStorm识别SCSS文件并启用Stylelint #

1. 打开WebStorm设置（快捷键Ctrl+Alt+S）
2. 导航到Languages & Frameworks > Style Sheets > Stylelint
3. 在File Patterns模块，点击+号添加匹配规则：*.scss
4. 确认Stylelint开关已开启，同时Node解释器选择项目本地的Node版本，Stylelint包路径指向项目node_modules下的stylelint

二、修复Stylelint "invalid option"错误 #

结合配置和报错信息，问题出在配置兼容性或无效选项上：

1. 检查配置依赖是否安装
   如果你的Stylelint配置中extends了stylelint-config-standard-scss这类扩展包，先确认已安装对应依赖：

   npm install stylelint-config-standard-scss --save-dev
   

2. 排查无效配置项
   打开你的Stylelint配置文件（或package.json中的stylelint字段），核对所有规则和配置项：
   • 规则名称是否拼写正确，是否属于当前Stylelint版本支持的范围
   • 避免使用已被废弃的配置项（比如旧版的extends格式或规则）
3. 手动验证配置
   在项目根目录执行命令，直接通过终端排查错误：

   npx stylelint "**/*.scss"
   

   终端会输出具体的无效选项位置，根据提示修改配置即可。如果终端运行正常，重启WebStorm同步配置即可。

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