Vue attribute order should follow best practices

[NiklasPor]

The default vue attribute order should match up with the official recommendations by the vue team.

https://v3.vuejs.org/style-guide/#element-attribute-order-recommended

[zsakowitz]

Here is the order I use for Vue:

[
    "^#",
    "^:?is$",
    "^v-for$",
    "^v-(if|else-if|else)$",
    "^v-show$",
    "^v-cloak$",
    "^v-pre$",
    "^v-once$",
    "^:?id$",
    "^:?ref$",
    "^:?key$",
    "^v-model$",
    "^v-model:",
    "^:?class$",
    "^:(?!data-)",
    "$DEFAULT",
    "^:?data-",
    "^@",
    "^v-html$",
    "^v-text$",
    "^v-bind$"
],

[andreww2012]

I'm using the following order to be on par with vue/attributes-order's eslint-plugin-vue rule:

[
  "^((v-bind)?:?|v-)is$",
  "^v-for$",
  "^v-(if|else-if|else|show|cloak)$",
  "^v-(once|pre|memo)$",
  "^(v-bind)?:?id$",
  "^(v-bind)?:?key$",
  "^(v-bind)?:?ref$",
  "^(v-)?slot$",
  "^#",
  "^v-model$",
  "^v-(?!bind(:|$)|on(:|$)|html$|text$)",
  "^class$",
  "^(v-bind)?:class$",
  "^((v-bind)?:)?(?!data-|v-|:|@|#)",
  "$DEFAULT",
  "^((v-bind)?:)?data-",
  "^v-bind$",
  "^v-on:",
  "^@",
  "^v-html$",
  "^v-text$"
]

This order did work very well on a relatively big project (~200 components & views), but any improvements ideas are appreciated :)