【Prettier】在 Vue 中对每个属性进行自动换行

Vue 风格指南中强烈建议：多个 attribute 的元素应该分多行撰写，每个 attribute 一行。

在使用 Prettier 时，默认情况下会对超出 printWidth 的内容进行换行，这就导致了有的元素属性换行了，有的没有，非常不美观。就像这样：

<template>
  <img src="https://vuejs.org/images/logo.png" alt="Vue Logo" />
template>

可以通过配置 Prettier 的 singleAttributePerLine 属性来解决：

"singleAttributePerLine": true

这项属性会在 HTML、Vue 和 JSX 中每行强制使用单个属性。

完美！

<template>
  <img
    src="https://vuejs.org/images/logo.png"
    alt="Vue Logo"
  />
template>