使用Prettier时应配置哪些规则在类变量前添加额外空行

原生能力边界 #

• 原生Prettier 核心工具未提供直接对应的内置配置开关，默认会自动擦除类大括号后、首个类成员之前的所有冗余空行，即便手动在代码中插入空行，执行Prettier格式化后也会被自动删除。

可落地的实现方案 #

方案一：使用社区专属Prettier插件 #

• 安装prettier-plugin-sort-class-members插件，该插件在处理类结构格式化时，支持自定义类成员周围的空行规则
• 在项目根目录的Prettier配置文件中加入对应配置即可：

{
  "plugins": ["prettier-plugin-sort-class-members"],
  "classMemberOrdering": {
    "lines-between": 1
  }
}

• 按照该配置，插件会在类大括号和首个类成员之间主动插入1个空行，匹配期望的格式化效果。

方案二：搭配ESLint规则协同格式化 #

• 若不想引入额外Prettier插件，可通过ESLint与Prettier的协同配置实现效果
• 启用@typescript-eslint/lines-around-class-membersESLint规则，将规则参数设置为类成员前后强制保留指定空行，调整工具执行顺序让ESLint的自动修复逻辑在Prettier格式化流程之后执行，即可在Prettier完成基础格式清理后，补全类成员前的目标空行。

注意：不要尝试通过Prettier内置的空行相关配置实现该效果，截至当前所有稳定版本的Prettier，内置规则都会对类开头的冗余空行做自动压缩，没有内置开关可以保留这类空行。

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