Search code examples
visual-studio-codeformattingprettier

vs code prettier - adds new line after @Input() decorator in angular

I've been using prettier for near 2 years now to format my angular code. Starting last week prettier starts to insert a new line behind all angular statements with decorators like @Input(), @Output(), @ViewChild(),..

resulting in something like

@Input()
property1

@Output()
emitter

which doubles the line count and doesn't add to readability.

My prettier settings are:

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

Event when I reset to default settings, this new line thing still occurs. Does anybody has suggestions? Thanks.

Solution

  • I found the following related open feature request: https://github.com/prettier/prettier/issues/1974

    It looks like, for now, they do not have an option to change the behaviour...

    According to Angular style guideline, it should be on one line: https://angular.io/guide/styleguide#decorate-input-and-output-properties