How do you stop prettier or beautify breaking JS objects onto multiple lines?

user_12681643 0
Viewed 635

I need this:

    var short_sleeve = {
        type: "Short Sleeve",
        id: this.item.epos_code,
    };

To look like this:

var short_sleeve = { type: "Short Sleeve", id: this.item.epos_code, };

Here is my prettierrc.json:

{
    "bracketSpacing": false,
    "endOfLine": "auto",
    "printWidth": 300,
    "proseWrap": "never",
    "tabWidth": 4,
    "trailingComma": "all",
    "useTabs": true
}

and here is my vs code settings.json

{
    "prettier.singleQuote": true,
    "prettier.tabWidth": 4,
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "prettier.printWidth": 300,
    "editor.formatOnSave": true,
    "files.trimTrailingWhitespace": true,
    "diffEditor.ignoreTrimWhitespace": false,
    "prettier.proseWrap": "never",
    "materialTheme.accent": "Acid Lime",
    "twig-language.wrap": 100
}

I have tried the solutions here: Prevent Prettier from converting single line object declarations into multi line in Visual Studio Code? . Nothing

This is solution isn't relevant as HTML is working fine: How do you stop Prettier in VS code splitting attributes onto multiple lines?

I have played with printWidth, setting this to 1000. Nothing. I have checked to see no other formatters are installed and running. Still Nothing.

No idea why it won't condense smaller objects onto one line.

prettier vscode-settings formatting json javascript
1 Answers

This is probably caused because your printWidth value is really large ("printWidth": 300)

printWidth specifies the line length that the printer will wrap on. Try decrementing the value to something like "printWidth": 160 instead (the default value is actually 80)

You can read more about it at the prettier documentation option page

user_74942180
Related