Prettier Autoformat for TypeScript not Working

For me Prettier has been doing an awesome job when auto-formatting JavaScript code on save. However, when using TypeScript files (.tsx) it didn’t work. Here is how to fix it:

First, press shift + cmd + p (Mac), enter “settings” and choose “Preferences: Open Settings (JSON)”. Then add the following:

"[typescript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" },
"[typescriptreact]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }

Make sure you have set "editor.formatOnSave": true

That’s it! Happy coding! :-)