如何用ESLint禁止多行对象内多个属性同行的格式？

要禁止这种混合行的对象格式，你需要调整两个ESLint规则的配置，核心是让多行对象（大括号换行的情况）强制每个属性单独一行，同时保留全一行的对象格式：

修改后的规则配置 #

'object-curly-newline': [2, {
  consistent: true,
  multiline: true,
  minProperties: 1
}],
'object-property-newline': [2, {
  allowAllPropertiesOnSameLine: true,
  enforceForMultilineObjects: true
}]

配置说明 #

• object-curly-newline：

  • consistent: true 确保大括号要么都在同一行，要么都换行，避免单边换行的情况；
  • multiline: true 只要对象内部有换行（比如属性单独一行），就强制大括号换行；
  • 去掉原来的minProperties:4改为minProperties:1，这样哪怕只有2个属性，也能支持换行后每个属性单独一行的格式，不会因为属性数少就允许混合行。

• object-property-newline：

  • allowAllPropertiesOnSameLine: true 保留全一行的对象格式；
  • enforceForMultilineObjects: true（默认开启）强制多行对象的每个属性必须单独一行，直接禁止「大括号换行但多个属性挤在同一行」的情况。

验证效果 #

修改后，ESLint会：

• 允许：{ a: 1, b: 2 };（全一行）
• 允许：

  {
    a: 1,
    b: 2,
  };
  

• 禁止：

  {
    a: 1, b: 2,
  };
  

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