Vue.js lint 强制组件为单行

Question

I have a component in Vue template

 <MyComponent
  class='class'
  someattribute='...'
  @event='eventListener'
/>

When I try to run lint it automatically reformats my code to following

 <MyComponent class='class' someattribute='...' @event='eventListener' />

I'm trying to disable it from doing so but can't find any corresponding rule. Any ideas how to avoid this?

I just want it to stay however I write it and disable any rules regarding it.

Answer 1

you should not do this, single line props are recommended by Vue officially: https://v2.vuejs.org/v2/style-guide/#Multi-attribute-elements-strongly-recommended

If you really want to change it.

• in your package.json file, find if there is a eslintConfig

  • if it has, add this config in its rules : "vue/max-attributes-per-line": "off"

• if no eslintConfig , you can add one. the default config should look like this:

"eslintConfig": {
//... other config
       "rules": {
      "vue/max-attributes-per-line": "off"
    }
  },