如何在使用 prettier 的类中的方法声明前后添加新行？

Posted 2023-02-22

【中文标题】如何在使用 prettier 的类中的方法声明前后添加新行？

【英文标题】：How to add new line after and before method declarations in classes using prettier?

【发布时间】：2019-03-17 05:55:03

【问题描述】：

在 vs 代码编辑器中使用 prettier plugin 在 typescript 文件中的类中的方法声明前后添加新行需要配置哪些设置？

我们如何通过在.prettierrc 或tslint.json 文件中写入任何规则来实现？

当前行为是

function one()
// some code

function two()
// some code

预期结果

function one()
// some code


function two()
// some code

我已尝试在 tslint.json

中使用以下行

"lines-between-class-methods": "true"

但没用

【参考方案1】：

在你的 es-lint 规则中试试这个，

"lines-between-class-members" : ["error", "always"]

如果您违反条件，它将引发错误。 &我认为你必须在一个类中声明你的函数才能工作。

除此之外，您可能无法使用 prettier 自动修复，因为事实证明空行很难自动生成。 Prettier 采用的方法是保留原始源代码中的空行。

【讨论】：

没有帮助。我已添加到我的tslint.json

我认为这是一个 es-lint 规则......不确定它是否适用于 tslint.json。我可能是错的。

【参考方案2】：

@lakshan 提到的是ESLint rule。有一个 TSLint 规则可以完成您正在寻找的内容，但与类方法有关。

https://github.com/chinchiheather/tslint-lines-between-class-members

运行

npm install --save-dev tslint-lines-between-class-members

添加

tslint.json

  "rulesDirectory": [
    "node_modules/tslint-lines-between-class-members"
  ],
  "rules": 
    "lines-between-class-members": true,
  

【参考方案3】：

lines-between-class-members 是 ESLint 的内置，替代了现在已弃用的 TSLint。此规则适用于 TypeScript 和 javascript，并且支持 --fix。有关详细信息，请参阅https://eslint.org/docs/rules/lines-between-class-members。对于 TypeScript，您可能希望将 exceptAfterSingleLine 设置为 true。

要使 ESLint 为 TypeScript 工作，你必须安装 npm 包 @typescript-eslint/parser 和 @typescript-eslint/eslint-plugin 并在你的 ESLint 配置中包含解析器和插件。见typescript-eslint docs。

  "parser": "@typescript-eslint/parser",
  "plugins": ["@typescript-eslint"],
  "rules": 
    "lines-between-class-members": ["error", "always",  "exceptAfterSingleLine": true ]