vue/max-attributes-per-lineがprettierでうまくフォーマットされなかった

Vue.js を eslint とprettierを使って開発してたらフォーマットがうまくいかなかったので解決策と設定をメモ
エディタはvscode

問題

eslint-plugin-vueのルールmax-attributes-per-line(１行あたり属性値の最大数を制限するルール）をprettierがうまくフォーマットしてくれなかった

解決

issueのコメントに対策があった
https://github.com/prettier/eslint-plugin-prettier/issues/94

結局、属性値の最大数を増やして対応が良さそう
複数の属性値が許可されてしまうが、１行あたりの文字数の制限超えたらよしなに改行してくれるので酷くならないよねって感じ
根本的な解決ではないけど、それで良いやと思ったので設定を変える

.eslintrc.json (落ち着いたやつ)

{
  "env": {
    "browser": true,
    "es6": true,
    "node": true
  },
  "parser": "vue-eslint-parser",
  "parserOptions": {
    "parser": "babel-eslint",
    "ecmaVersion": 2020,
    "sourceType": "module"
  },
  "plugins": [
    "vue",
    "prettier"
  ],
  "extends": [
    "eslint:recommended",
    "plugin:vue/recommended",
    "plugin:prettier/recommended",
    "prettier/vue"
  ],
  "rules": {
    "prettier/prettier": [
      "error",
      {
        "singleQuote": true,
        "htmlWhitespaceSensitivity": "ignore"
      }
    ],
    "vue/max-attributes-per-line": [
      "error",
      {
        "singleline": 5,
        "multiline": {
          "max": 1,
          "allowFirstLine": false
        }
      }
    ]
  }
}

その他

vscodeの拡張として入れてるprettierがフォーマットしてたり、veturがフォーマットしてた？のでvscodeの設定も少しいじった
（いじりすぎて迷子になったので後で見直す）