如何在 Visual Studio Code 中格式化 React 代码？

Question

在 VSCode 中自动格式化 React 代码时会出错。 我正在使用 Prettier 扩展。 那么为此格式化的最佳代码是什么？

Answer 1

Prettier 正是您所需要的。 如果你想要个性化的格式代码jsx，你可以根据自己的风格配置prettier。

Answer 2

使用vscode内部的react formatter，很好用：

你可以找到 React 和 TypeScript React 代码格式化程序：

Answer 3

最后，我找到了一种方法。 在 vscode 设置中，我必须将默认格式更改为更漂亮。

除了在项目上，还需要为项目创建一个具有合适配置的 .prettierrc 文件。

{
  "trailingComma": "es5",
  "tabWidth": 2,
  "semi": true,
  "singleQuote": true
}

如果您不需要它，您可以随时启用在没有 .prettierrc 文件的情况下格式化代码。