如何修复VSCode中Prettier的JSX/React格式化问题

Question

这就是我希望我的代码格式化的方式

render() {
return (
<div>
{this.state}
</div>
)
}

但当我alt+shift+F以更漂亮的格式格式化时，我会得到这个(这令人难以置信的沮丧！！(

render() {
return <div>{this.state}</div>;
}

在这种特殊的情况下，情况还不错，但我宁愿在遇到太复杂的事情之前，现在就解决它。

有人知道我可以更改哪些设置来解决这个问题吗？我四处找了一段时间，找不到任何有用的东西。

Answer 1

Prettier是一个固执己见的格式化程序，因此在这些配置设置之外没有太多灵活性。

不过，我并不担心，它之所以如此格式化，是因为它可以将所有内容放在一行中，而不会超出100的列范围，如果你尝试添加另一个div或其他内容，你会注意到它不会这样做，因此更复杂的场景不会有问题。