VS Code - space before function parentheses

Question

Is there a way to disable the removal of space before brackets when editing a function in VS code?

Let's say I have a function

function render () { // some code here } 

When I start editing it, VS Code removes the space before the brackets and converts this code to:

 function render() { // some code here } 

Is there any way to disable this behavior?

Answer 1

I found out that the parameter "editor.formatOnType": true . This is what makes the editor automatically format the code as you type. Disabling this helped solve the problem.

Answer 2

• In VS Code open File → Settings → Settings
• Add the JSON to the configuration:

"javascript.format.insertSpaceBeforeFunctionParenthesis": true

 function render () { // some code here } 

"javascript.format.insertSpaceBeforeFunctionParenthesis": false

 function render() { // some code here } 

3. Now you can continue to use the automatic format option "editor.formatOnType": true

Answer 3

I had the opposite problem with anonymous functions. We use a prettier extension. Auto-correction inserts a space before the parenthesis. And then he complains more about it.

 var anonfunc = function() { // Expected syntax. } var autocorrected = function () { // Auto-correct inserts a space } 

There is a similar code option that solves my problem:

 "javascript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": false 

By default, this is true . It took me a while until I was tired of correcting auto-correction.

Answer 4

I am on the VSCode team. Starting with VSCode 1.8, this formatting option is not supported immediately after installation, but we are tracking this function: https://github.com/Microsoft/vscode/issues/15386 , https://github.com/Microsoft/TypeScript/issues/12234

As a workaround, try the following:

• Install the eslint extension: ext install eslint
• Add "eslint.autoFixOnSave": true to your workspace or user preferences

• In the root of your project, create .eslintrc.json with:

   { ... "rules": { ... "space-before-function-paren": "error" } } 

  The eslint extension can create a .eslintrc.json starter for you using the create .eslintrc.json .

This will automatically format the functions so that after them to keep a space after them.

Answer 5

In my case, I wanted the normal indentation / formatting behavior of the VS code, so I turned off the eslint warning:

In the .eslintrc.js file that I typed inside the rules:

  'rules': { .... //disable rule of space before function parentheses "space-before-function-paren": 0 } 

Answer 6

In my case, I had to explicitly enable ESLint in my Vue.js project, although I had a .eslintrc.js file that was supposed to implement:

 extends: ['plugin:vue/exxential', '@vue/standard'] 

To do this, I pressed CTRL + Shift + P and searched for "ESLint: Enable ESLint"

Answer 7

Go to Settings and look for insertSpaceBeforeFunctionParenthesis in the search bar at the top.

Now check the box that says: JavaScript: Format: Insert Space Before Function Parenthesis