VS Code美化React HTML中的中断标签

vbo*_*yko 2 reactjs js-beautify visual-studio-code

我已经在VS代码中进行了美化,所以当我将其应用于

<div className="chatApp" style={style}>
    <Navigation />
    <ChatField />
</div>
Run Code Online (Sandbox Code Playgroud)

我懂了

  <
  div className = "chatApp"
  style = {
    style
  } >
  <
  Navigation / >
  <
  ChatField / >
  <
  /div>
Run Code Online (Sandbox Code Playgroud)

但我想要这样的东西

<div className = "chatApp"
 style = {
     style
 }>
     <Navigation />
     <ChatField />
 </div>
Run Code Online (Sandbox Code Playgroud)

问题是如何更改美化设置以不将标签传输到新行(div,p,span等)?

Tzo*_*Noy 10

这也发生在我身上。您需要将语言语法从“普通” javascript设置为“ javascript react”。

查看下面的图像,您将需要单击底部的状态栏并更改语法。

在此处输入图片说明

在此处输入图片说明

要更新项目中的所有文件,请转到“用户设置”或“工作区设置”,具体取决于您是希望为项目还是为用户设置文件。

现在查找:

  "files.associations": {},
Run Code Online (Sandbox Code Playgroud)

并覆盖它并设置如下所示的内容:

   "files.associations": {
       "*.js": "javascriptreact"
   }
Run Code Online (Sandbox Code Playgroud)