用于 javascript 代码缩进的更漂亮的配置答案

【问题标题】：Prettier config for javascript code indenting用于 javascript 代码缩进的更漂亮的配置
【发布时间】：2019-10-26 05:44:08
【问题描述】：

我在 Visual Studio Code 中使用 Prettier 进行格式化。

通常，它在我的 JS/TS 文件中效果很好。但它坚持将这样的代码包装成单行：

trigger('myInsertRemoveTrigger', [
  transition(':enter', [
    style({ opacity: 0 }),
    animate('5s', style({ opacity: 1 })),
  ]),
  transition(':leave', [
    animate('5s', style({ opacity: 0 }))
  ])
]),

变得像

    trigger('fadeInOut', [
      transition(':enter', [style({ opacity: 0 }), animate('.5s', style({ opacity: 1 }))]),
      transition(':leave', [animate('.5s', style({ opacity: 0 }))])
    ])

我觉得更难阅读。我查看了available options 并没有看到与此相关的任何内容。我可以以某种方式配置它吗？

目前，我的.prettierrc是

{
  "printWidth": 120,
  "singleQuote": true,
  "useTabs": false,
  "tabWidth": 2,
  "semi": true,
  "bracketSpacing": true
 }

【问题讨论】：

标签： javascript typescript prettier

【解决方案1】：

prettier 是自以为是的，因此你不能配置它重新格式化你的代码的方式：你只需要接受 prettier 所做的缩进:)

【讨论】：

我害怕那个
不要害怕。 自以为是的自动代码格式化是一种可以节省大量时间的技术。 thoughtworks.com/radar/techniques 建议这里的关键不是花几个小时讨论要执行哪些规则，而是选择一个有主见、可配置性最低和自动化的工具。（强调添加)。

【解决方案2】：

只需在数组的第一个元素后添加注释即可。

var a = [
  1, //
  2,
  3,
];

【讨论】：

我认为你的 hack 正是我们所要求的——但不是其他的东西。
@sylvanaar 希望这会有所帮助。我想我也可以分享不同的观点。黑客并不适合所有用户:)
这应该是公认的答案 - 所以我做了一些修改并投了赞成票。

【解决方案3】：

恐怕你唯一能做的就是减少printWidth。
但这显然也会影响您的其余代码。

【讨论】：

【解决方案4】：

根据您的描述，听起来您正在谈论“打印宽度”。尝试将“打印宽度”减小到 80 或更小。可能 50 个，具体取决于您的偏好。

{
  "printWidth": 80,
  "singleQuote": true,
  "useTabs": false,
  "tabWidth": 2,
  "semi": true,
  "bracketSpacing": true
 }

【讨论】：