vs代码更漂亮-在@Input（）装饰器后在angular中添加新行

Question

我已经使用prettier近两年了，以格式化angular代码。从上周开始，prettier开始在所有angular语句后面插入带有@Input()，@Output()，@ViewChild()等修饰符的新行。

导致类似

@Input()
property1

@Output()
emitter

这会使行数加倍，并且不会增加可读性。

我的prettier设置是：

  "editor.tabSize": 2,
  "prettier.singleQuote": true,
  "prettier.tabWidth": 2,
  "prettier.useTabs": false,
  "prettier.semi": true,
  "prettier.printWidth": 120,
  "prettier.eslintIntegration": true,

事件，当我重置为默认设置时，此新行仍然发生。 有人有建议吗？谢谢。

Answer 1

我发现了以下相关的开放功能请求： https://github.com/prettier/prettier/issues/1974

目前看来，他们还没有选择来更改行为...

根据Angular样式指南，它应该在一行上： https://angular.io/guide/styleguide#decorate-input-and-output-properties

Answer 2

当“打印宽度”选项非常小的数字（例如：80）时，Visual Studio代码更漂亮的语句会在语句中的每个参数中添加新行。

请按照下面提到的步骤解决代码格式化中的此问题：

1. 在Visual Studio代码中，转到文件->首选项->设置
2. 在搜索栏中输入“漂亮”。
3. 导航至该选项 更漂亮：打印宽度 在此行数限制内插入代码
4. 根据需要修改width选项，我将其设置为800以恢复所有内容 同一行。
5. 此外，检查js相同的行标签选项，如下图所示。

感谢希望能对您有所帮助...