Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add consistent option to vue/padding-line-between-tags docs #2003

Merged
merged 1 commit into from Oct 5, 2022
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
32 changes: 17 additions & 15 deletions docs/rules/padding-line-between-tags.md
Expand Up @@ -52,11 +52,12 @@ This rule requires or disallows newlines between sibling HTML tags.

This rule requires blank lines between each sibling HTML tag by default.

A configuration is an object which has 3 properties; blankLine, prev and next. For example, { blankLine: "always", prev: "br", next: "div" } means “one or more blank lines are required between a br tag and a div tag.” You can supply any number of configurations. If a tag pair matches multiple configurations, the last matched configuration will be used.
A configuration is an object which has 3 properties; `blankLine`, `prev` and `next`. For example, `{ blankLine: "always", prev: "br", next: "div" }` means “one or more blank lines are required between a `br` tag and a `div` tag.” You can supply any number of configurations. If a tag pair matches multiple configurations, the last matched configuration will be used.

- `blankLine` is one of the following:
- `always` requires one or more blank lines.
- `never` disallows blank lines.
- `consistent` requires or disallows a blank line based on the first sibling element.
- `prev` any tag name without brackets.
- `next` any tag name without brackets.

Expand Down Expand Up @@ -106,12 +107,12 @@ A configuration is an object which has 3 properties; blankLine, prev and next. F

</eslint-code-block>

### Require newlines before `<br>`
### Require newlines between `<br>` and `<img>`

`{ blankLine: 'always', prev: '*', next: 'br' }`
`{ blankLine: 'always', prev: 'br', next: 'img' }`

<eslint-code-block fix :rules="{'vue/padding-line-between-tags': ['error', [
{ blankLine: 'always', prev: '*', next: 'br' }
{ blankLine: 'always', prev: 'br', next: 'img' }
]]}">

```vue
Expand All @@ -120,8 +121,9 @@ A configuration is an object which has 3 properties; blankLine, prev and next. F
<ul>
<li>
</li>

<br />

<img />
<li>
</li>
</ul>
Expand All @@ -131,26 +133,26 @@ A configuration is an object which has 3 properties; blankLine, prev and next. F

</eslint-code-block>

### Require newlines between `<br>` and `<img>`
### Require consistent newlines

`{ blankLine: 'always', prev: 'br', next: 'img' }`
`{ blankLine: 'consistent', prev: '*', next: '*' }`

<eslint-code-block fix :rules="{'vue/padding-line-between-tags': ['error', [
{ blankLine: 'always', prev: 'br', next: 'img' }
{ blankLine: 'consistent', prev: '*', next: '*' }
]]}">

```vue
<template>
<div>
<ul>
<li>
</li>
<br />

<img />
<li>
</li>
<li />
<li />
<li />
</ul>

<div />

<div />
</div>
</template>
```
Expand Down