How to prevent Visual Studio Code from pushing chained functions on to new line?

Question

How do I prevent Visual Studio Code from pushing chained JavaScript functions on to a new line as can be seen illustrated by the GIF below:

As you can see, it makes the code extremely hard to view and extends a simple if check in to multiple lines. I am using the extension called Prettier - Code Formatter and I have looked through the preferences and found the following:

// Format a file on save. A formatter must be available, the file must not be 
//auto-saved, and editor must not be shutting down.
"editor.formatOnSave": false

Which stops it formatting completely when you hit save. I have looked through the other options and couldn't find a setting for this.

Does the above process have a name?

How can I retain formatOnSave but prevent it from formatting it in the way that it is?

Answer 1

It seems that this isn't configurable (unsure if it ever will be), this is a direct copy of an Github post from this issue:

The suggested behavior of this feature has been:

• Wrap after hitting the line length limit
• Wrap after 3 chained methods
• Wrap after a configurable number of chained methods
• Wrap when one of two conditions is met:
  • The line length limit is reached
  • The user opts into it by manually inserting a newline, like object literals

The initial implementation was (1).

The current implementation is (2).

(3) is unlikely to happen since prettier tries to avoid configuration.

The consensus is against (4) due to wanting to minimize user input influence in prettier's output.

I think the current implementation (2) makes sense in the majority of cases, but I find myself wanting (4) often enough that I no longer use prettier for JS.

Based on that, there isn't currently a way to modify this behaviour and neither is there any plans for this (as of writing this).

Definitely not the answer I'd like, but it is what is given.