visual studio code javascript destructuring assignment create new line on format

user_3445926 0
Viewed 1288

I had some issues with destructuring assignment shorthand when auto formatting JavaScript and TypeScript code in Visual Studio Code. I got result like this: 

var {
    check,
    validationResult
} = require("express-validator/check");

but I need it to looks like this:

var { check, validationResult } = require("express-validator/check");

I have Beautify installed, and in my settings:

{
    "editor.wordWrapColumn": 160,
    "typescript.format.placeOpenBraceOnNewLineForFunctions": false,
    "typescript.format.placeOpenBraceOnNewLineForControlBlocks": false,
    "javascript.format.placeOpenBraceOnNewLineForFunctions": false,
    "javascript.format.placeOpenBraceOnNewLineForControlBlocks": false
}

I don't find anywhere else I could set place new line to false. Any idea how to set it right?

visual-studio-code typescript javascript
1 Answers

I notice this problem may resolve by changing the file extension when React component involved. For example:

*.js -> *.jsx
*.ts -> *.tsx

Visual Studio Code seems to have trouble to format JSX when it's in the wrong type of file.

ESLint and "JavaScript and TypeScript intelliSense" extensions seems also don't like it.

Webpack works no matter what.

user_34459260
Related