Как получить файл React. js для правильного форматирования

Question

У меня есть файл с именем App.js в коде Visual Studio, и файл на самом деле хорошо отображается в браузере, но форматируется неправильно:

Я переключил тип файла на javascriptreact:

Но он по-прежнему не будет форматироваться с SHIFT-ALT-F.

Вот мой settings.json файл:

{
    "terminal.integrated.shell.windows": "C:\\Program Files\\Git\\bin\\bash.exe",
    "explorer.confirmDelete": false,
    "files.autoSave": "afterDelay",
    "editor.formatOnSave": true,
    "explorer.confirmDragAndDrop": false,
    "editor.acceptSuggestionOnEnter": "off",
    "editor.fontSize": 12,
    "window.zoomLevel": 0,
    "workbench.editor.enablePreview": false,
    "editor.renderWhitespace": "all",
    "[javascriptreact]": {
        "editor.defaultFormatter": "HookyQR.beautify"
    },
    "[javascript]": {
        "editor.defaultFormatter": "HookyQR.beautify"
    },
    "[html]": {
        "editor.defaultFormatter": "HookyQR.beautify"
    },
    "[json]": {
        "editor.defaultFormatter": "HookyQR.beautify"
    },
    "editor.wordWrap": "on",
    "git.enableSmartCommit": true,
    "git.autofetch": true,
    "diffEditor.ignoreTrimWhitespace": false,
    "workbench.sideBar.location": "left",
}

Что еще мне нужно установить, чтобы SHIFT-ALT-F правильно форматировал мой файл React Javascript?