ESLint-帮助识别缩进子规则

Question

如何获得ESLint indent来喜欢此代码：

const a = `
  <li
    style=${styleMap({
      color: '#F00',      // bad line
      background: '#0F0'  // bad line
    })}                   // bad line
  >Something</li>
`;

它不喜欢我标记为bad line的行上的缩进。这就是我想做的：

const a = `
  <li
    style=${styleMap({
  color: '#F00',
  background: '#0F0'
})}
  >
    <span>Something</span>
  </li>
`;

看起来很荒谬。

这是我当前有关“缩进”的规则：

indent: ['error', 2, { SwitchCase: 1 }],

我浏览了indent文档，但没有发现任何适合这种情况的东西。

---

编辑：我遍历了indent规则的所有选项，将它们全部设置为0，然后通过一个接一个地将它们设置为10，以查看哪个变量会影响我的表情。看起来ObjectExpression是元凶，但该值通常很好。

似乎在处理模板文字多行占位符对象声明时存在一些问题。我认为我唯一的办法就是将其添加到ignoreNodes。

Answer 1

Note：有关最终版本，请参见此答案的底部。在继续整理所有内容时，对它进行了进一步的调整。

一旦将其范围进一步缩小，我就能找到一些更好的Google结果，并且找到了这个答案，该答案似乎与我的问题非常相似，但并不完全相同：Ignore the indentation in a template literal, with the ESLint `indent` rule

AST模式不适用于我的特定情况（至少是第一个情况）。用AST资源管理器戳它之后，我最终使用了以下模式：

indent: ['error', 2, { 
  ignoredNodes: [
    'TemplateLiteral > CallExpression > ObjectExpression',
    'TemplateLiteral *'
  ]
]

第一个涵盖了我所提出问题的确切场景。第二个涵盖了类似的情况：

const a = `
  <li
    style=${someFunc(
      'arg1',
      'arg2'
    })}      
  >Something</li>
`;

似乎这最终是ESLint必须以某种方式解决的问题，因为仅ObjectExpression检查在模板文字占位符内部确实很混乱。

---

编辑：

我将第二个表达式从TemplateLiteral > CallExpression更改为TemplateLiteral > *，因为我发现了两个尚未捕获的稍微不同的场景。我希望更具体一些，但我不想确定80种不同的情况。

---

编辑2：

而是将TemplateLiteral > *更改为TemplateLiteral *，因为发现了更多嵌套且未被> *捕获的内容。

现在，模式只是其中之一：

indent: ['error', 2, { 
  ignoredNodes: [
    'TemplateLiteral *'
  ]
]