哇,多么可爱的博客文章标题,对吧?
Prettier 是一个“有主见的代码格式化工具”。我强烈建议您使用它。他们有一份 文档 更深入地介绍了原因,但他们的三个营销要点最能说明问题
- 您按下保存键,代码就会被格式化
- 无需在代码审查中讨论样式
- 节省您的时间和精力
但 Prettier 并非支持所有语言。尤其是 HTML。 它在 JSX 上非常出色,我真的很习惯喜欢它。但是当我切换到 Rails .erb
模板或 WordPress 网站,在那里我正在编辑 .php
文件,甚至是一个普通的 .html
文件时...... 就没有 Prettier 了。
他们有 一个针对它的开发分支,但我还没有尝试过。目前,我不得不尝试一个在野外和经过考验的 HTML 美化工具。VS Code 插件 Beautify 可以做到,并且拥有 650 万次安装,所以这似乎是个不错的选择。

通过使用此插件,这意味着您可以配置它,而不是使用 VS Code 的内部版本,该版本显然不可配置。
问题是......
我第一次尝试这样做时,发现它导致我的 Prettier 停止工作。这对我是不可接受的,因为我希望 Prettier 成为首要的格式化工具。我不确定它是否同时运行两者,或者是在它自己运行 Beautify 的情况下将 Prettier 放到最后,或者到底是什么,但我当时无法弄清楚。
对我的诀窍是告诉它只关心某些文件类型!
在我的 settings.json
中
{
...
"beautify.language": {
"html": ["html", "php", "erb"],
"css": [],
"js": []
}
}
现在我可以让 Prettier 处理所有它支持的语言,并对 Prettier 尚未支持的 HTML 内容使用 Beautify。到目前为止一切顺利。
Prettier 在两周前发布的 1.15 版本中添加了 HTML 支持
https://prettier.node.org.cn/blog/2018/11/07/1.15.0.html
我想我看到了让你开心的事情,Chris。 https://prettier.node.org.cn/blog/2018/11/07/1.15.0.html
在之前的博客文章中,他们还谈到了基于浏览器的版本。因此,您可以将其放入 Codepen。这似乎是一个很棒的功能。
谢谢您!我 буквально только что столкнулся с этой проблемой пару недель назад!
“您按下保存键,代码就会被格式化”的问题在于,第三方代码(即来自某些无知的同事的代码)在查看时不会美观。
Beautify 不包含 Prettier 吗?