使用什么更漂亮的扩展设置来格式化我的反应代码？

Question

我正在使用 VS 代码编辑器，我已经安装了 prettier，但我的代码仍然粘在一起，而不是移动到下一行。我尝试更改一些设置，但效果不佳。这是示例代码

return (<>
        <span style={{display:"flex",color:"white"}}>
            <img src={comment.snippet.topLevelComment.snippet.authorProfileImageUrl}  onError={(e)=>{e.target.onerror = null; e.target.src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRlsUYbM6jWxjKND6TCCeEE5sBTwEJqyUhtLg&usqp=CAU"}} alt="" style={{borderRadius:"50%",width:30,height:30,border:"None"}}></img>
    <span><h6>{comment.snippet.topLevelComment.snippet.authorDisplayName}</h6>{comment.snippet.topLevelComment.snippet.textOriginal}</span>
        </span>
        <div>{comment.replies!==undefined?<><button className="comment"  onClick={toggle} style={{ marginBottom: '1rem' ,marginLeft:'2rem'}}>replies</button>
        <Collapse isOpen={isOpen}>
          <div>
            <div>
            <Replies replies={comment.replies}/>
            </div>
          </div>
        </Collapse></>:null}
        
      </div></>
    )

Answer 1

更漂亮的最新版本[3.17.0] vs code 最新版本 1.41.1 保存格式为 'ON' 默认格式化程序 esbenp.prettier-vscode

使用什么更漂亮的扩展设置来格式化我的反应代码？

What prettier extension settings to use to format my react code?

visual-studio-code

prettier