如何配置Prettier/ESLint实现代码块及函数间添加空行？

需求说明 #

当前Prettier格式化后的代码：

function _project(x, k, dim: number = -1, eps: Float = -1.0) {
  if (eps < 0) {
    if (x.dtype == torch.float32) {
      eps = 4e-3
    } else {
      eps = 1e-5
    }
  }
  maxnorm = (1 - eps) / sabs(k) ** 0.5
  maxnorm = torch.where(k.lt(0), maxnorm, k.newFull([], 1e15))
  norm = x.norm({ dim: dim, keepdim: true, p: 2 }).clampMin(1e-15)
  cond = norm > maxnorm
  projected = (x / norm) * maxnorm
  return torch.where(cond, projected, x)
}
function lambdaX(
  x: TorchTensor,
  k: TorchTensor,
  keepdim = false,
  dim = -1,
) {
  return _lambdaX(x, k, { keepdim: keepdim, dim: dim })
}
function _lambdaX(
  x: TorchTensor,
  k: TorchTensor,
  keepdim: Bool = false,
  dim: number = -1,
) {
  return (
    2 /
    (1 + k * x.pow(2).sum({ dim: dim, keepdim: keepdim })).clampMin(
      1e-15,
    )
  )
}
function inner(
  x: TorchTensor,
  u: TorchTensor,
  v: TorchTensor,
  k,
  keepdim = false,
  dim = -1,
) {

期望的目标格式：

function _project(x, k, dim: number = -1, eps: Float = -1.0) {
  if (eps < 0) {
    if (x.dtype == torch.float32) {
      eps = 4e-3
    } else {
      eps = 1e-5
    }
  }
  
  maxnorm = (1 - eps) / sabs(k) ** 0.5
  maxnorm = torch.where(k.lt(0), maxnorm, k.newFull([], 1e15))
  norm = x.norm({ dim: dim, keepdim: true, p: 2 }).clampMin(1e-15)
  cond = norm > maxnorm
  projected = (x / norm) * maxnorm

  return torch.where(cond, projected, x)
}

function lambdaX(
  x: TorchTensor,
  k: TorchTensor,
  keepdim = false,
  dim = -1,
) {
  return _lambdaX(x, k, { keepdim: keepdim, dim: dim })
}

function _lambdaX(
  x: TorchTensor,
  k: TorchTensor,
  keepdim: Bool = false,
  dim: number = -1,
) {
  return (
    2 /
    (1 + k * x.pow(2).sum({ dim: dim, keepdim: keepdim })).clampMin(
      1e-15,
    )
  )
}

function inner(
  x: TorchTensor,
  u: TorchTensor,
  v: TorchTensor,
  k,
  keepdim = false,
  dim = -1,
) {

现有Prettier配置：

{
  "semi": false,
  "parser": "typescript",
  "trailingComma": "all",
  "singleQuote": true,
  "printWidth": 72,
  "tabWidth": 2,
  "useTabs": false,
  "arrowParens": "avoid",
  "quoteProps": "as-needed",
  "bracketSpacing": true,
  "proseWrap": "always",
  "endOfLine": "lf",
  "singleAttributePerLine": true,
  "importOrder": [
    "^\\w(.*)$",
    "^@(.*)$",
    "~(.*)$",
    "\\..(.*)$",
    "\\.(.*)$"
  ],
  "importOrderSeparation": true,
  "importOrderSortSpecifiers": true
}

当前调用Prettier的方式：

const prettier = require('prettier')

function pretty(string) {
  return prettier.format(string, config)
}

解决方案 #

Prettier本身没有内置配置直接控制块级语句后的空行，需要结合ESLint的规则来实现，具体步骤如下：

1. 安装依赖 #

安装ESLint、TypeScript插件及Prettier兼容包：

npm install eslint @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint-config-prettier eslint-plugin-prettier --save-dev

2. 配置ESLint规则 #

在项目根目录创建.eslintrc.json，添加以下配置：

{
  "parser": "@typescript-eslint/parser",
  "plugins": ["@typescript-eslint", "prettier"],
  "extends": [
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended",
    "plugin:prettier/recommended"
  ],
  "rules": {
    "@typescript-eslint/padding-line-between-statements": [
      "error",
      // 函数声明之间强制添加空行
      { "blankLine": "always", "prev": "function", "next": "function" },
      // 块级语句（如if块）结束后，后续非return语句前添加空行
      { "blankLine": "always", "prev": "block-like", "next": "*" },
      // return语句前强制添加空行（排除紧跟块之后的情况）
      { "blankLine": "always", "prev": "*", "next": "return" },
      // 块内直接return时不添加空行
      { "blankLine": "never", "prev": "block-like", "next": "return" }
    ]
  }
}

3. 调整格式化流程 #

修改格式化函数，先通过ESLint自动修复空行规则，再用Prettier格式化：

const prettier = require('prettier')
const { ESLint } = require('eslint')

const eslint = new ESLint({
  fix: true,
  overrideConfigFile: './.eslintrc.json'
})

async function pretty(string) {
  // 先用ESLint修复空行规则
  const results = await eslint.lintText(string, { filePath: 'dummy.ts' })
  const fixedCode = results[0].output || string
  // 再用Prettier格式化
  return prettier.format(fixedCode, config)
}

规则说明 #

• @typescript-eslint/padding-line-between-statements规则可精准控制不同语句间的空行，上述配置完全覆盖需求：if块后加空行、函数之间加空行、return语句前加空行。
• plugin:prettier/recommended将Prettier整合到ESLint流程中，eslint-config-prettier会关闭ESLint中与Prettier冲突的规则，确保两者兼容。

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