Prettier extension in VS Code won't format JSX code

Question

I'm trying to enable the Prettier extension to format JSX code when document is saved in VS Code, but after installing the extension does not work for me. I've tried to fix using the ways listed below:

• Restarting VS Code (force quitting)
• Reinstalling Prettier extension
• Toggling the extension on and off inside settings
• Enabling "format on save" in the Prettier settings
• Toggling "React Snippets Experimental" in prettier settings

Answer 1

Press Control + Shift + P or Command + Shift + P (Mac) to open the command palette and type 'format document' and then select Format Document option.

Then you will be asked to select the default formatter Select prettier formatter from the options list You're done

Answer 2

Enable Prettier as default formatter in VS Code settings:

Settings > Default formatter > Prettier