reactjstypescriptvisual-studio-codeprettiertsx

vscode prettier doesn't format .tsx file

I've used the Prettier extension in the Visual Studio code editor for a long time, but recently, I have been writing to React with Typescript. So I need to configure for Prettier to format .tsx files.

Solution

  • Update 2024

    Create a .vscode folder at the root of your project. In the .vscode folder, create the settings.json file, and in it, write this section:

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

    Don't forget to add .vscode in the .gitignore file.