为啥 prettier 开始拆分短线？

Posted 2023-02-22

【中文标题】为啥 prettier 开始拆分短线？

【英文标题】：Why prettier started splitting short lines?为什么 prettier 开始拆分短线？

【发布时间】：2021-09-23 22:07:34

【问题描述】：

我在 VSCode 中为 Angular 项目使用了几个月。它工作正常。

今天我将 Angular 升级到 v11，并且在我开始更改 ts 文件的那一刻（在这种情况下，我正在更改带有单元测试的文件，扩展名为 .spec.ts），并且有 85 个字符的一行被拆分为：

const tblRows = fixture.debugElement.nativeElement.querySelectorAll('table tr');

到

const tblRows =
      fixture.debugElement.nativeElement.querySelectorAll('table tr');

同时，同一文件中更长的行没有被拆分：

it('Loaded map descriptions should load names and set state for "Edit" buttons', () => 

我开始学习更多，发现设置“打印宽度”是 80​​。我将其更改为 140，然后更改为 120 - 它没有任何明显的差异。

我检查了另一个文件，120 个字符的行没有被分割...

我已经检查过了，prettier 被用作默认格式：

请帮助查找此问题的原因。谢谢！

【问题讨论】：

我希望我知道答案，因为我自己也在与这个作斗争。但是我认为长线没有被分割的原因是它是一个字符串（不是代码）并且有一个设置。

可能是一个原因，但该字符串后面还有其他标记/字符，因此它们可能已被拆分...

@PeS：你最近也升级了 Angular 吗？

是的。和nestjs。

【参考方案1】：

我仍然不知道为什么 prettier 停止工作，但今天我想出了如何强制它工作。

TBH，很遗憾我不能早点这样做，我唯一的借口是有很多东西要学，我只是不知所措。

无论如何，今天我又试了一次，并在“vscode prettier 如何定义行长”上进行了谷歌搜索，这让我找到了https://prettier.io/docs/en/options.html。在此页面上，我注意到应用设置的推荐方法是通过配置文件，此处记录：https://prettier.io/docs/en/configuration.html

阅读最后一个链接后，我刚刚将“.prettierrc”文件添加到我的项目的根目录并添加了一个键，因此文件如下所示：

  "printWidth": 120

在那之后，prettier 就像一个魅力。

附：讨厌让我的问题无人回答；）