v1.0.85

New rule

README.md

@@ -191,6 +191,7 @@ Each item has emojis denoting:
 
 | Name | Description | 🟠 | 🟢 |
 | :- | :- | :- | :- |
+| [crisp/vue-attribute-linebreak](https://github.com/crisp-oss/eslint-plugin-crisp/blob/master/rules/vue-attribute-linebreak.js) | Enforces linebreak before first attribute and after last attribute |  | 🟢 |
 | [crisp/vue-computed-order](https://github.com/crisp-oss/eslint-plugin-crisp/blob/master/rules/vue-computed-order.js) | Ensures computed properties are alphabetically ordered |  | 🟢 |
 | [crisp/vue-emits-order](https://github.com/crisp-oss/eslint-plugin-crisp/blob/master/rules/vue-emits-order.js) | Ensures emits properties are alphabetically ordered |  | 🟢 |
 | [crisp/vue-header-check](https://github.com/crisp-oss/eslint-plugin-crisp/blob/master/rules/vue-header-check.js) | Ensures `script`, `template` and `style` tags start with corresponding comment block |  | 🟢 |

index.js

@@ -34,6 +34,7 @@ module.exports = {
     "ternary-parenthesis": require("./rules/ternary-parenthesis"),
     "two-lines-between-class-members": require("./rules/two-lines-between-class-members"),
     "variable-names": require("./rules/variable-names"),
+    "vue-attribute-linebreak": require("./rules/vue-attribute-linebreak"),
     "vue-computed-order": require("./rules/vue-computed-order"),
     "vue-emits-order": require("./rules/vue-emits-order"),
     "vue-header-check": require("./rules/vue-header-check"),

package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-crisp",
-  "version": "1.0.84",
+  "version": "1.0.85",
   "description": "Custom ESLint Rules for Crisp",
   "author": "Crisp IM SAS",
   "main": "index.js",

recommended-vue.js

@@ -334,6 +334,7 @@ module.exports = {
     ],
 
     // Crisp Vue rules
+    "crisp/vue-attribute-linebreak": "error",
     "crisp/vue-computed-order": "error",
     "crisp/vue-emits-order": "error",
     "crisp/vue-header-check": "error",

rules/vue-attribute-linebreak.js

@@ -0,0 +1,51 @@
+module.exports = {
+  meta: {
+    type: "layout",
+    docs: {
+      description: "enforce the location of first and last attributes",
+      category: "Stylistic Issues",
+      recommended: false,
+    },
+    fixable: null
+  },
+
+  create(context) {
+    function report(firstAttribute, location) {
+      context.report({
+        node: firstAttribute,
+        message: `Expected a linebreak ${location} this attribute.`
+      })
+    }
+
+    return context.parserServices.defineTemplateBodyVisitor({
+      VStartTag(node) {
+        // Skip 'template' tags
+        if (node.parent.name === "template") {
+          return;
+        }
+
+        // No attributes
+        if (node.attributes.length === 0) {
+          return;
+        }
+
+        const firstAttribute = node.attributes[0];
+        const lastAttribute = node.attributes[node.attributes.length - 1];
+
+        // Enforce line-break before first attribute
+        if (node.loc.start.line === firstAttribute.loc.start.line) {
+          report(firstAttribute, "above");
+
+          return;
+        }
+
+        // Enforce line-break after last attribute
+        if (node.loc.end.line === lastAttribute.loc.start.line) {
+          report(firstAttribute, "below");
+
+          return;
+        }
+      }
+    })
+  }
+};