VS Code中校验CSS/Less/Sass及propertyIgnoredDueToDisplay警告不生效问题

一、代码校验启用方法 #

VS Code本身已经内置了CSS、Less、Sass的基础校验能力，也支持第三方插件实现更灵活的自定义校验：

• 原生校验开启：打开VS Code设置界面，分别搜索css.validate、less.validate、scss.validate三个选项，确认全部为开启状态即可启用官方默认的校验规则。
• 增强校验配置：如果需要自定义校验规则，可以安装Stylelint插件，在项目根目录添加.stylelintrc配置文件，按需调整校验规则即可实现更精细化的代码校验。

二、propertyIgnoredDueToDisplay规则未触发警告原因 #

你使用的是1.60.0 Insiders内测版本，规则未触发大概率和版本本身的缺陷相关，可逐一排查以下场景：

• 内测版本BUG：1.60.0 Insiders属于预览测试版本，官方已知该版本CSS内置校验的触发逻辑存在适配问题，propertyIgnoredDueToDisplay规则会偶发失效，你可以切换到正式版VS Code验证，相同代码在正式版中会正常触发inline元素设置margin-top的警告提示。
• 规则配置被修改：检查设置中css.lint.propertyIgnoredDueToDisplay的配置值，默认值为warning，如果被手动调整为ignore就不会触发对应提示，改回默认值即可。
• 第三方插件冲突：如果安装了其他CSS校验类插件，可能会覆盖VS Code原生的校验逻辑，导致原生规则失效，暂时禁用其他CSS相关插件后重启VS Code即可验证是否为冲突问题。

内容的提问来源于stack exchange，提问作者Volker E.