Import statement automatically converted to multi-line in VSCODE

Question

My VSCode editor automatically wraps import statements into new lines on save or format document:

Before:

After:

I don't want this behaviour. How to disable this rule?

I am programming in Angular 7 typescript and following extension is installed on it:

1. Angular Essentials
2. Prettier
3. TSlint

Please, help me to remove this rule or behavior.

Thank you.

Answer 1

You cannot disable prettier.printWidth, but you can increase the line-length until it so that it stops wrapping your imports.

You can do this by opening (or creating) a file called prettier.rc in the root dir (one above /src in an Angular project) and adding the property:

"printWidth": 250

or whatever number is required.

A word of warning: As the printWidth is a central theme of Prettier - as an opinionated formatter, what you are trying to do may not be the best option in the long-term.

For Angular project, as opposed to using Prettier consider adding new rules to tslint or even creating custom rules where required.

Answer 2

This is caused by Prettier.

I don't think you can disable this on its own (short of using a // prettier-ignore comment above the import) but you can try increasing the line length at which prettier starts wrapping with the prettier.printWidth setting