VSCode 格式化插件Prettier，如何禁止 html 文件拆行？

Question

VSCode 格式化插件Prettier，如何禁止 html 文件拆行？
例如，下图的样式，如何禁止拆行

Answer 1

参考:https://segmentfault.com/q/1010000042736460?utm_source=sf-similar-question
https://segmentfault.com/q/1010000043119755/a-1020000043119757

可以通过在 VSCode 的设置中添加以下配置来禁止 Prettier 对 HTML 标签进行拆行：

{
  "html.format.wrapLineLength": 0,
  "[html]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.formatOnSave": true,
    "editor.formatOnPaste": true,
    "editor.formatOnType": true,
    "editor.formatOnSaveMode": "modifications"
  }
}

其中，html.format.wrapLineLength 设置为 0 时表示不限制行宽度。[html] 部分是为了在 HTML 文件中生效。如果你还想修改其他类型文件的 Prettier 配置，可以使用对应的文件后缀名代替 html，比如 [javascript] 表示 JavaScript 文件。

注意，这样做会禁止 Prettier 对 HTML 的标签拆行，但不会禁止对 HTML 中的代码进行格式化。如果你希望完全禁止 Prettier 对 HTML 进行格式化，可以将editor.defaultFormatter 配置改为其他格式化插件或者禁用该项。

或者用 <!-- prettier-ignore --> 注释来指示 Prettier 忽略当前行的格式化。