如何以VS代码格式.vue文件制作Veture扩展名，以便将HTML属性保留在一行上？

Question

编写.vue文件时，我正在使用VS Code和Veture扩展名。

当前，格式化程序会自动将所有html属性放在换行符上。像这样

<v-item-group
            class="shopCategoriesImageGroup"
            multiple
            v-for="(item, index) in getProductCategoryIcons"
            :key="index"
>

我想让他们保持一致。所需结果：

<v-item-group class="shopCategoriesImageGroup" multiple v-for="(item, index) in getProductCategoryIcons":key="index" >

从VS Code设置面板中，Veture具有以下格式选项：

• 无
• prettyhtml

• js-beutify-html

• 漂亮

遵循文档：

https://vuejs.github.io/vetur/formatting.html

我尝试使用更漂亮的配置的html whitespacing，没有运气。这些似乎不是允许在一行上保留html属性的配置选项。

仅当我使用none作为格式化程序时，才会出现所需的效果。但这需要我手动设置代码格式。

任何想法我应该设置哪些配置选项，以便在保存时自动在一行上显示代码格式？

还是我应该尝试其他扩展名？

Answer 1

解决了！！

您必须将print width属性设置为更大的数字。像这样：

"vetur.format.defaultFormatterOptions": {
    "prettyhtml": {
      "printWidth": 250, // No line exceeds 250 characters
    }
  }

在此找到信息：https://github.com/vuejs/vetur/issues/114，感谢Phill的评论。