Visual Studio Code Formatting fail on save

Question

I\'ve started learning React Native.

I\'m using Visual Studio Code as my editor.

I\'ve set up the boiler plate and started the app. But whenever I change a .

Answer 1

Add this on settings.json file. Whether you are using any extension or not, use this code. It works fine for me:

Answer 2

i just had this problem , apparently its because of the beautify/prettier , try to disable both , then restart Vs code (your editor) . but then if u really want to use prettier , go under its extension settings and make sure its in strict with whitespaces and toogle around a few other settings and you should be fine , cheers .

Answer 3

Use Prettier Code Formatter instead of Beautify. Works perfectly for language mode Babel JavaScript

Answer 4

1. Disable js-css-html formatter.
2. if you are using prettier and beautify together, override the setting as :

"beautify.ignore": [
        "**/*.js",
        "**/*.jsx"
    ]

Answer 5

Just turning off format on save option from the settings would work.

Answer 6

You should search for "format" in settings.json. You'll find a whole lot of TypeScript/JavaScript formatting tweaks in there, but the one that stands out to me is:

  // Defines space handling after opening and before closing non empty brackets.
  "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets": false

Alternative, you're not a fan of formatting at all, you can turn it off entirely:

  // Enable/disable default JavaScript formatter.
  "javascript.format.enable": true,

However, a lot of my formatting options come from language server extensions, so if you're using one for React Native specifically, be sure to check the attributes in settings.json, or the docs to see if there are any attributes you can add.