React Prettier：如何禁用字符串属性自动添加大括号的行为？

你遇到的问题是Prettier自动把<ComponentA text='Text A'/>格式化为<ComponentA text={'Text A'}/>，要禁用这个行为，只需修改Prettier配置：

• 找到或在项目根目录创建Prettier配置文件（比如.prettierrc或prettier.config.js）
• 添加以下配置：

如果是JSON格式的.prettierrc：

{
  "jsxAttributeValueStyle": "string",
  "jsxSingleQuote": true
}

如果是JS格式的prettier.config.js：

module.exports = {
  jsxAttributeValueStyle: 'string',
  jsxSingleQuote: true
};

配置说明 #

• jsxAttributeValueStyle: "string"：强制JSX属性值使用字符串引号形式，不再转成大括号包裹的表达式。
• jsxSingleQuote: true：保持属性值使用单引号，和你原本的代码风格一致。

配置完成后，保存文件时Prettier就会保留你最初的代码格式。

内容的提问来源于stack exchange，提问作者CCCC