Is it possible to customize the formatting of HTML code in VSCode so that it is not formatted by tag attributes by attributes, and the transfer was carried out by the parameter "html.format.wrapLineLength": 120 Example: Now:

<input type="email" onChange={this.handleEmailChange} id="inputEmail" className="form-control" placeholder="Email address" required autofocus />

It is necessary:

 <label for="inputEmail" className="sr-only">Email address</label> <input type="email" onChange={this.handleEmailChange} id="inputEmail" className="form-control" placeholder="Email address" required autofocus /> <label for="inputPassword" className="sr-only">Password</label> <input type="password" onChange={this.handlePasswordChange} id="inputPassword" className="form-control" placeholder="Password" required />

I tried the parameter: "html.format.unformatted": "input", did NOT work.

    1 answer 1

    important nuance !!!:

    • user options
      global

    • workspace settings
      local overlap global are stored in the current project in the settings.json file

       .vscode ├── launch.json ├── settings.json └── tasks.json

    when setting up, switching between files occurs by clicking on the caption underlined in the picture

    enter image description here

     { "html.format.wrapAttributes": "force-aligned" } <input type="email" onChange={this.handleEmailChange} id="inputEmail" className="form-control" placeholder="Email address" required autofocus /> 
     { "html.format.wrapAttributes": "force-expand-multiline" } <input type="email" onChange={this.handleEmailChange} id="inputEmail" className="form-control" placeholder="Email address" required autofocus /> 
     { "html.format.wrapAttributes": "auto" } <input type="email" onChange={this.handleEmailChange} id="inputEmail" className="form-control" placeholder="Email address" required autofocus />

    enter image description here