Vscode設置vue文件換行問題

問題

使用vscode編輯vue文件的時候，會使用vetur。它默認的配置的換行機制尤其是js的換行比如下圖，讓人感覺有點不舒服

解決方案

選擇 文件->首選項->設置 或者直接打開 setting.json, 進行下面的配置即可

  "vetur.format.defaultFormatter.html": "js-beautify-html",
  "vetur.format.defaultFormatter.js": "vscode-typescript", //js不換行
  "vetur.format.defaultFormatter.ts": "vscode-typescript", // ts不換行
  "vetur.format.defaultFormatterOptions": {
    "prettier": {
      "singleQuote": true
    },
    "js-beautify-html": {
        "wrap_attributes": "auto" // auto是html部分不換行； force-expand-multiline是換行
    },
    "prettyhtml": {
        "printWidth": 100,
        "singleQuote": false,
        "wrapAttributes": false,
        "sortAttributes": false
    }
  }