eslint-plugin-vue icon indicating copy to clipboard operation
eslint-plugin-vue copied to clipboard

[Bug] Removal of bound prop ordering (vue/attribute-order)

Open johnleider opened this issue 5 years ago • 1 comments

Tell us about your environment Windows 10

  • ESLint version: v5.10.0
  • eslint-plugin-vue version: >= v5.0.0-beta.0
  • Node version: v.10.13.0

Please show your full configuration:

module.exports = {
  extends: [
    'standard',
    'plugin:vue/recommended'
  ],

  parserOptions: {
    parser: 'babel-eslint',
    ecmaVersion: 2017,
    sourceType: 'module'
  },

  rules: {
    'max-len': 'off',
    'indent': 'off',
    'vue/component-name-in-template-casing': ['error', 'kebab-case'],
    'vue/script-indent': ['error', 2, {
      'baseIndent': 1,
      'switchCase': 1,
      'ignores': []
    }],
    'vue/max-attributes-per-line': ['error', {
      'singleline': 1,
      'multiline': {
        'max': 1,
        'allowFirstLine': false
      }
    }],
    'vue/html-closing-bracket-newline': ['error', {
      'singleline': 'never',
      'multiline': 'always'
    }],
    'vue/html-closing-bracket-spacing': 'error',
    'vue/no-v-html': 'off'
  }
}

What did you do?

<element
  color="blue"
  gradient="to top, rgba(0,0,0,.32), rgba(0,0,0,.32)"
  :src="require('@/assets/bg.jpg')"
  min-height="100vh"
/>

What did you expect to happen? :src to move above color/gradient

What actually happened? :src receives no warning

This was altered in https://github.com/vuejs/eslint-plugin-vue/pull/421. Not completely clear as to whether it was an unintentional change or intended. If it was intended, please reconsider allowing the separation of bound props from unbound.

johnleider avatar Dec 22 '18 20:12 johnleider

Hi @johnleider

This was intentional change. We decided to treat bindings and attributes as the same thing in regards to order. You can keep it however you want, but we just won't auto-fix it. We often change regular attributes to bindings, and not forcing different location simplifies diff and does not mess with how you want to keep your attributes in place. Some want bindings first, some group it by name or something else. So what this rule does is to force only essential groups of attributes in certain way, but not those that often changes from one to another with a single sign.

Also If we'd introduce order by bound, unbound. Properties like class or style might end up looking like this:

:class=""
:style=""
id=""
...
class=""
style=""

or we'd have to introduce exceptions, making this rule not very consistent.

As @chrisvfritz mentioned in #410 Style Guide does not make a distinction between those either.

However if you still think that having this possibility has more benefits, you might try to add extra option, let's say boundAttributesFirst and submit PR :)

michalsnik avatar Dec 31 '18 00:12 michalsnik

Since this issue is very old and the behavior is intended, I'll close it now.

FloEdelmann avatar May 16 '23 15:05 FloEdelmann