Skip to content

vue/new-line-between-multi-line-property

enforce new lines between multi-line properties in Vue components

  • 🔧 The --fix option on the command line can automatically fix some of the problems reported by this rule.

📖 Rule Details

This rule aims at enforcing new lines between multi-line properties in Vue components to help readability

<script> /* ✗ BAD */ export default { props: { value: { type: String, required: true }, focused: { type: Boolean, default: false, required: true }, label: String, icon: String }, computed: { } } </script>
Now loading...
<script> /* ✓ GOOD */ export default { props: { value: { type: String, required: true }, focused: { type: Boolean, default: false, required: true }, label: String, icon: String }, computed: { } } </script>
Now loading...

🔧 Options

json
{
  "vue/new-line-between-multi-line-property": ["error", {
    "minLineOfMultilineProperty": 2
  }]
}
  • minLineOfMultilineProperty ... Define the minimum number of rows for a multi-line property. default 2

📚 Further Reading

🚀 Version

This rule was introduced in eslint-plugin-vue v7.3.0

🔍 Implementation