Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
5 contributors

Users who have contributed to this file

@mysticatea @ThomasR @ota-meshi @michalsnik @patrickabkarian
100 lines (78 sloc) 2.75 KB
pageClass sidebarDepth title description
rule-details
0
vue/html-closing-bracket-newline
require or disallow a line break before tag's closing brackets

vue/html-closing-bracket-newline

require or disallow a line break before tag's closing brackets

  • ⚙️ This rule is included in "plugin:vue/strongly-recommended" and "plugin:vue/recommended".
  • 🔧 The --fix option on the command line can automatically fix some of the problems reported by this rule.

People have own preference about the location of closing brackets. This rule enforces a line break (or no line break) before tag's closing brackets.

<div
  id="foo"
  class="bar"> <!-- On the same line with the last attribute. -->
</div>

<div
  id="foo"
  class="bar"
> <!-- On the next line. -->
</div>

📖 Rule Details

This rule aims to warn the right angle brackets which are at the location other than the configured location.

<template>
  <!-- ✓ GOOD -->
  <div id="foo" class="bar">
  <div
    id="foo"
    class="bar"
  >

  <!-- ✗ BAD -->
  <div id="foo" class="bar"
  >
  <div
    id="foo"
    class="bar">
</template>

🔧 Options

{
  "vue/html-closing-bracket-newline": ["error", {
    "singleline": "never",
    "multiline": "always"
  }]
}
  • singleline ... the configuration for single-line elements. It's a single-line element if the element does not have attributes or the last attribute is on the same line as the opening bracket.
    • "never" (default) ... disallow line breaks before the closing bracket.
    • "always" ... require one line break before the closing bracket.
  • multiline ... the configuration for multiline elements. It's a multiline element if the last attribute is not on the same line of the opening bracket.
    • "never" ... disallow line breaks before the closing bracket.
    • "always" (default) ... require one line break before the closing bracket.

Plus, you can use vue/html-indent rule to enforce indent-level of the closing brackets.

"multiline": "never"

<template>
  <!-- ✓ GOOD -->
  <div
    id="foo"
    class="bar">

  <!-- ✗ BAD -->
  <div
    id="foo"
    class="bar"
  >
</template>

🔍 Implementation

You can’t perform that action at this time.