VSCode Prettier HTML code formatting automatic line wrapping

problem description

The

VSCode editor uses the Prettier plug-in formatting code. But after formatting, the HTML tags are all on one line.

the platform version of the problem and what methods you have tried

VSCode version 1.30.1 (1.30.1)

related codes

/ / Please paste the code text below (do not replace the code with pictures)

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>Page Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
  </head>
  <body>
    <form action="/search" method="POST">
      <div>
        <input type="text" name="kw">
      </div>
      <div>
        <button type="submit">Search</button>
      </div>
    </form>
  </body>
</html>

what result do you expect? What is the error message actually seen?

after formatting:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>Page Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
  </head>
  <body>
    <form action="/search" method="POST">
      <div><input type="text" name="kw" /></div> <!--  -->
      <div><button type="submit">Search</button></div> <!--  -->
    </form>
  </body>
</html>

if you set to disable the display of one line, and turn off the end of the automatic label, both functions.


if you use it in the project, it is recommended to configure it in combination with eslint, and the shift+alt+f automatic optimization code can be done. If you search Baidu for details, it contains a lot of

.
Menu