如何为.stylelint配置两套差异化规则实现分目录样式校验

完全可以实现你要的效果，不需要拆分多条启动命令重复扫描，直接利用Stylelint原生的overrides配置能力即可，配置一次、执行一次命令就能覆盖所有校验规则，同时避免重复校验问题。

具体配置步骤 #

• 调整根目录主配置文件
  把仅需要在src/app目录生效的stylelint-no-px插件从全局配置中移除，保留所有目录通用的插件、规则作为基础配置：

  // 根目录 .stylelintrc.json
  {
      "extends": "stylelint-config-standard",
      "plugins": [
          "stylelint-scss"
      ],
      "rules": {
          // 原有全项目生效的通用规则保持不变
          ...
      }
  }
  

• 追加目录专属覆写配置
  在根配置中新增overrides字段，给src/app目录下的scss文件单独引入stylelint-no-px插件并开启对应规则，这部分配置仅对匹配到路径的文件生效，不会影响其他目录：

  // 完整根配置示例
  {
      "extends": "stylelint-config-standard",
      "plugins": [
          "stylelint-scss"
      ],
      "rules": {
          // 原有全项目生效的通用规则保持不变
          ...
      },
      "overrides": [
          {
              "files": ["src/app/**/*.scss"],
              "plugins": ["stylelint-no-px"],
              "rules": {
                  // 此处配置stylelint-no-px对应的规则，例如
                  "plugin/no-px": [true, { "ignore": ["1px"] }]
              }
          }
      ]
  }
  

• 保留原有启动命令即可
  不需要修改package.json里的脚本，原有命令"stylelint": "stylelint \"src/**/*.scss\""可以直接使用。

方案优势 #

• 仅需执行一次扫描，src/app目录不会被重复校验
• 通用规则只需要维护一份，不需要在多套配置间同步修改
• 非src/app目录的文件不会加载stylelint-no-px插件，扫描性能更高
• 配置合并逻辑由Stylelint内部处理，src/app目录下的文件会自动继承所有通用规则，再叠加专属的px校验规则，不需要手动写多套配置的继承关系

如果你更倾向拆分独立配置文件，也可以单独创建app目录专属的配置文件，在overrides中通过configFile字段指向该独立配置文件即可，效果和内联配置完全一致。

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