Prettier не форматирует файл .tsx

отредактируйте настройку следующим образом в settings.json VScode

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

Расширяя ответ iNeelPatel, мне пришлось добавить две строки в настройки VSCode JSON:

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

Это даст идеальное решение

То же самое случилось со мной только что. Я установил красивее как средство форматирования по умолчанию в настройках, и он снова начал работать. Мой модуль форматирования по умолчанию был нулевым.

https://github.com/microsoft/vscode/issues/108447#issuecomment-706642248

Мое использование

Я настроил это с помощью файла .eslintrc.json eslint. Прежде всего, в массиве "extends" я добавил

"plugin:@typescript-eslint/recommended"

а также

"prettier/@typescript-eslint"

Затем я установил "parser" на "prettier/@typescript-eslint"

Наконец, в массив "plugins" я добавил "@typescript-eslint".

Вам нужно будет взять пару пакетов NPM (установите с параметром -D):

@typescript-eslint/eslint-plugin
@typescript-eslint/parser

Для справки, весь мой .eslintrc.json файл:

{
  "env": {
    "browser": true,
    "es6": true,
    "jest": true
  },
  "extends": [
    "plugin:@typescript-eslint/recommended",
    "prettier/@typescript-eslint",
    "plugin:prettier/recommended"
  ],
  "globals": {
    "Atomics": "readonly",
    "SharedArrayBuffer": "readonly"
  },
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    },
    "project": "./src/tsconfig.json",
    "ecmaVersion": 2018,
    "sourceType": "module"
  },
  "plugins": ["react", "@typescript-eslint", "jest"],
  "rules": {
    "react/react-in-jsx-scope": "off"
  }
}

Надеюсь это поможет.