vue.js 在HTML中每个应答器前后强制使用更白色的空格

z5btuh9x  于 2023-03-03  发布在  Vue.js
关注(0)|答案(1)|浏览(434)

我在一个项目中使用Prettier,这个项目使用Nuxt(Vuejs框架)。我看到一个关于Prettier和HTML呈现的非常奇怪的行为。

  • 如果我有一个应答器(h1,h2,div...),如下所示:*
<h2>I am a too long title and i proc a error</h2>
  • 更漂亮的人想要这样的格式 *
<h2>
  I am a too long title and i proc a error
</h2>
  • 没有问题,我喜欢这种格式,但当我在浏览器检查器中检查元素时,我可以看到文本前后的白色。*
<h2> I am a too long title and i proc a error </h2>

这是真的意想不到的,真的很糟糕,我有资金解决这个问题的唯一方法是不要用漂亮的格式。但我不能相信这个问题是在所有世界上的每个项目谁使用漂亮。
https://codepen.io/deeluxe/pen/dyqXZMj-〉第二个元素前后有空格的示例。

c0vxltue

c0vxltue1#

我已经添加了一个评论,但我也想把它作为一个答案张贴在这里,因为其他人可能也有同样的问题在某个时候。
在更漂亮的选项中,你可以配置htmlWhitespaceSensitivity,它可以有不同的值。这个设置也可以在Vue模板中用来格式化HTML。
htmlWhitespaceSensitivity选项可以有三个值:

strict

严格的敏感性确保元素中的空格字符不会改变。(如果这看起来不错,那是另一个问题)

<h2
  >I am a too long title and i proc a error</h2
>

ignore

如果格式化需要,Pretier会添加空格。

<h2>
  I am a too long title and i proc a error
</h2>

一米四分一秒

遵守html元素的默认空白字符处理。

<h2>
  I am a too long title and i proc a error
</h2>

<!-- inside a pre element: -->
<pre>
I am a too long title and i proc a error</pre
>

相关问题