Vue.js Prettier删除html标记和文本之间的空间

我已经使用cli安装了一个vue项目，配置了eslint和prettier，但是prettier做了我不想做的事情。我希望在两个标记之间有一个|，但是当我保存时，prettier会删除标记和|之间的空间。 我怎样才能解决这个问题。 代码如下： 请注意第二行的|，以及它被prettier删除之前的空间

<div id="nav">
  <router-link :to="{name: 'event-list'}">List</router-link>|
  <router-link :to="{name: 'event-create'}">Create</router-link>
</div>
<router-view />

名单|
创造

如果您遇到的问题是忽略空白会导致呈现的HTML缺少空白：

List| Create

然后，您可以将

|

包装在

标记中，该标记将在渲染时自动在元素之间添加一个空格。一旦包装好，漂亮的人就不应该抱怨了

列表
|
创造

---

您可能还想查看更漂亮配置中的设置，以及它们的设置。

谢谢您的回答。我在|之前添加了一个，但是，我需要知道如何摆脱更漂亮的配置