Prettier's format on save messes up .jsx files

Question

I have format on save enabled, and it works fine in .js files but when I try to save code in my .jsx files everything gets messed up. How can I configure my prettier to avoid this problem without disabling format on save?

Answer 1

If you are using VS Code, try adding this to your settings.json file:

{
  "editor.formatOnSave": false,
  "[javascriptreact]": {
      "editor.formatOnSave": true
  }
}

Answer 2

for anyone who encounter this, you probably have some other VS Code plugin installed, such as Beautify which is recommended by vscode. Uninstall it and prettier should works now.