如何在 VS Code 中为 .jsx 文件启用自动更漂亮的格式？

【问题标题】：How do I enable automatic prettier formatting for .jsx files in VS Code?如何在 VS Code 中为 .jsx 文件启用自动更漂亮的格式？
【发布时间】：2020-10-04 09:11:08
【问题描述】：

我设置了 Prettier 在保存时自动格式化 .js、.vue 和其他文件。但是，由于某种原因，它不会触发 .jsx 文件。

点击状态栏中的“Prettier”项显示：

["INFO" - 10:48:25 am] Enabling prettier for range supported languages
[
  "graphql",
  "javascript",
  "javascriptreact",
  "json",
  "typescript",
  "typescriptreact"
]

这似乎是正确的。

我错过了什么？

【问题讨论】：

标签： visual-studio-code jsx prettier

【解决方案1】：

啊，我找到了。在 VS Code 的 settings.json 中，每个文件类型都必须为 formatOnSave 单独启用：

{
    "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode",
        "editor.formatOnSave": true
    },
    "[vue]": {
        "editor.formatOnSave": true,
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[javascriptreact]": {
        "editor.formatOnSave": true,
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },

 }

注意 javascriptreact 作为 JSX 的标识符。

【讨论】：