You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

是否存在可排序对象键以外内容(如CSS属性)的ESLint规则?

关于ESLint检测CSS模板字符串属性排序的规则说明

原生ESLint自带的sort-keys规则仅针对JS对象键排序,无法覆盖CSS模板字符串内的属性排序场景,但社区维护的ESLint插件可以实现这个需求:

  • eslint-plugin-css-in-js:插件中的sort-declarations-alphabetically规则,专门用于检测并强制CSS-in-JS(含模板字符串形式)里的CSS属性按字母排序,支持配置大小写敏感性、是否忽略注释等参数,可匹配你现有sort-keys规则的行为。
  • eslint-plugin-styled-components:若你使用styled-components,该插件的sort-declarations规则可针对其模板字符串进行CSS属性排序检查。

以eslint-plugin-css-in-js为例的配置步骤:

  1. 安装插件:
npm install eslint-plugin-css-in-js --save-dev
  1. 在ESLint配置文件中添加规则:
{
  "plugins": ["css-in-js"],
  "rules": {
    "css-in-js/sort-declarations-alphabetically": [
      "error",
      {
        "caseSensitive": true,
        "ignoreComments": true
      }
    ]
  }
}

不同插件的配置细节略有差异,可根据插件文档调整参数,对齐你之前sort-keys规则的要求(如最小属性数量、自然排序等)。

内容的提问来源于stack exchange,提问作者Trevor

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.13 09:55:18