Skip to content

Commit 866d057

Browse files
mysticateamichalsnik
authored andcommitted
Update: improve warnings about key on template elements (#45)
* Update: add check for `key` attribute of child of templates (refs #43) * New: no-template-key (fixes #43) * replace emoji by github notation
1 parent c2f3338 commit 866d057

34 files changed

+375
-152
lines changed

README.md

+1
Original file line numberDiff line numberDiff line change
@@ -109,6 +109,7 @@ The `--fix` option on the command line automatically fixes problems reported by
109109
| :white_check_mark: | [no-invalid-v-show](./docs/rules/no-invalid-v-show.md) | disallow invalid v-show directives. |
110110
| :white_check_mark: | [no-invalid-v-text](./docs/rules/no-invalid-v-text.md) | disallow invalid v-text directives. |
111111
| :white_check_mark: | [no-parsing-error](./docs/rules/no-parsing-error.md) | disallow parsing errors in `<template>`. |
112+
| | [no-template-key](./docs/rules/no-template-key.md) | disallow 'key' attribute on '<template>'. |
112113

113114
<!--RULES_TABLE_END-->
114115

docs/rules/html-end-tags.md

+5-5
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
11
# Enforce end tag style (html-end-tags)
22

3-
- 🔧 This rule is fixable with `eslint --fix` command.
3+
- :wrench: This rule is fixable with `eslint --fix` command.
44

55
This rule enforce the way of end tags.
66

77
- [Void elements] disallow end tags.
88
- Other elements require end tags.
99

10-
## 📖 Rule Details
10+
## :book: Rule Details
1111

1212
This rule reports the following elements:
1313

1414
- [Void elements] which have end tags.
1515
- Other elements which do not have end tags and are not self-closing.
1616

17-
👎 Examples of **incorrect** code for this rule:
17+
:-1: Examples of **incorrect** code for this rule:
1818

1919
```html
2020
<template>
@@ -28,7 +28,7 @@ This rule reports the following elements:
2828
</template>
2929
```
3030

31-
👍 Examples of **correct** code for this rule:
31+
:+1: Examples of **correct** code for this rule:
3232

3333
```html
3434
<template>
@@ -42,7 +42,7 @@ This rule reports the following elements:
4242
</template>
4343
```
4444

45-
## 🔧 Options
45+
## :wrench: Options
4646

4747
Nothing.
4848

docs/rules/html-no-self-closing.md

+5-5
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
# Disallow self-closing elements (html-no-self-closing)
22

3-
- 🔧 This rule is fixable with `eslint --fix` command.
3+
- :wrench: This rule is fixable with `eslint --fix` command.
44

55
Self-closing (e.g. `<br/>`) is syntax of XML/XHTML.
66
HTML ignores it.
77

8-
## 📖 Rule Details
8+
## :book: Rule Details
99

1010
This rule reports every self-closing element except XML context.
1111

12-
👎 Examples of **incorrect** code for this rule:
12+
:-1: Examples of **incorrect** code for this rule:
1313

1414
```html
1515
<template>
@@ -19,7 +19,7 @@ This rule reports every self-closing element except XML context.
1919
</template>
2020
```
2121

22-
👍 Examples of **correct** code for this rule:
22+
:+1: Examples of **correct** code for this rule:
2323

2424
```html
2525
<template>
@@ -33,6 +33,6 @@ This rule reports every self-closing element except XML context.
3333
</template>
3434
```
3535

36-
## 🔧 Options
36+
## :wrench: Options
3737

3838
Nothing.

docs/rules/html-quotes.md

+6-6
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@ You can choose quotes of HTML attributes from:
88

99
This rule enforces the quotes style of HTML attributes.
1010

11-
## 📖 Rule Details
11+
## :book: Rule Details
1212

1313
This rule reports the quotes of attributes if it is different to configured quotes.
1414

15-
👎 Examples of **incorrect** code for this rule:
15+
:-1: Examples of **incorrect** code for this rule:
1616

1717
```html
1818
<template>
@@ -23,7 +23,7 @@ This rule reports the quotes of attributes if it is different to configured quot
2323
</template>
2424
```
2525

26-
👍 Examples of **correct** code for this rule:
26+
:+1: Examples of **correct** code for this rule:
2727

2828
```html
2929
<template>
@@ -33,7 +33,7 @@ This rule reports the quotes of attributes if it is different to configured quot
3333
</template>
3434
```
3535

36-
👎 Examples of **incorrect** code for this rule with `"single"` option:
36+
:-1: Examples of **incorrect** code for this rule with `"single"` option:
3737

3838
```html
3939
<template>
@@ -44,7 +44,7 @@ This rule reports the quotes of attributes if it is different to configured quot
4444
</template>
4545
```
4646

47-
👍 Examples of **correct** code for this rule with `"single"` option:
47+
:+1: Examples of **correct** code for this rule with `"single"` option:
4848

4949
```html
5050
<template>
@@ -54,7 +54,7 @@ This rule reports the quotes of attributes if it is different to configured quot
5454
</template>
5555
```
5656

57-
## 🔧 Options
57+
## :wrench: Options
5858

5959
- `"double"` (default) ... requires double quotes.
6060
- `"single"` ... requires single quotes.

docs/rules/no-confusing-v-for-v-if.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,15 @@
66
77
So when they exist on the same node, `v-if` directive should use the reference which is to the variables which are defined by the `v-for` directives.
88

9-
## 📖 Rule Details
9+
## :book: Rule Details
1010

1111
This rule reports the elements which have both `v-for` and `v-if` directives in the following cases:
1212

1313
- The `v-if` directive does not use the reference which is to the variables which are defined by the `v-for` directives.
1414

1515
In that case, the `v-if` should be written on the wrapper element.
1616

17-
👎 Examples of **incorrect** code for this rule:
17+
:-1: Examples of **incorrect** code for this rule:
1818

1919
```html
2020
<template>
@@ -26,7 +26,7 @@ In that case, the `v-if` should be written on the wrapper element.
2626
</template>
2727
```
2828

29-
👍 Examples of **correct** code for this rule:
29+
:+1: Examples of **correct** code for this rule:
3030

3131
```html
3232
<template>
@@ -48,6 +48,6 @@ In that case, the `v-if` should be written on the wrapper element.
4848
</template>
4949
```
5050

51-
## 🔧 Options
51+
## :wrench: Options
5252

5353
Nothing.

docs/rules/no-duplicate-attributes.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -3,20 +3,20 @@
33
When duplicate arguments exist, only the last one is valid.
44
It's possibly mistakes.
55

6-
## 📖 Rule Details
6+
## :book: Rule Details
77

88
This rule reports duplicate attributes.
99
`v-bind:foo` directives are handled as the attributes `foo`.
1010

11-
👎 Examples of **incorrect** code for this rule:
11+
:-1: Examples of **incorrect** code for this rule:
1212

1313
```html
1414
<template>
1515
<div foo="abc" :foo="def"></div>
1616
</template>
1717
```
1818

19-
👍 Examples of **correct** code for this rule:
19+
:+1: Examples of **correct** code for this rule:
2020

2121
```html
2222
<template>
@@ -25,7 +25,7 @@ This rule reports duplicate attributes.
2525
</template>
2626
```
2727

28-
## 🔧 Options
28+
## :wrench: Options
2929

3030
Nothing.
3131

docs/rules/no-invalid-template-root.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
This rule checks whether every template root is valid.
44

5-
## 📖 Rule Details
5+
## :book: Rule Details
66

77
This rule reports the template root in the following cases:
88

@@ -12,7 +12,7 @@ This rule reports the template root in the following cases:
1212
- The root element has `v-for` directives. E.g. `<template><div v-for="x in list">{{x}}</div></template>`.
1313
- The root element is `<template>` or `<slot>` elements. E.g. `<template><template>hello</template></template>`.
1414

15-
👎 Examples of **incorrect** code for this rule:
15+
:-1: Examples of **incorrect** code for this rule:
1616

1717
```html
1818
<template>
@@ -38,7 +38,7 @@ This rule reports the template root in the following cases:
3838
</template>
3939
```
4040

41-
👍 Examples of **correct** code for this rule:
41+
:+1: Examples of **correct** code for this rule:
4242

4343
```html
4444
<template>
@@ -59,6 +59,6 @@ This rule reports the template root in the following cases:
5959
</template>
6060
```
6161

62-
## 🔧 Options
62+
## :wrench: Options
6363

6464
Nothing.

docs/rules/no-invalid-v-bind.md

+5-5
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
This rule checks whether every `v-bind` directive is valid.
44

5-
## 📖 Rule Details
5+
## :book: Rule Details
66

77
This rule reports `v-bind` directives in the following cases:
88

@@ -13,7 +13,7 @@ This rule does not report `v-bind` directives which do not have their argument (
1313

1414
This rule does not check syntax errors in directives because it's checked by [no-parsing-error] rule.
1515

16-
👎 Examples of **incorrect** code for this rule:
16+
:-1: Examples of **incorrect** code for this rule:
1717

1818
```html
1919
<template>
@@ -25,7 +25,7 @@ This rule does not check syntax errors in directives because it's checked by [no
2525
</template>
2626
```
2727

28-
👍 Examples of **correct** code for this rule:
28+
:+1: Examples of **correct** code for this rule:
2929

3030
```html
3131
<template>
@@ -38,11 +38,11 @@ This rule does not check syntax errors in directives because it's checked by [no
3838
</template>
3939
```
4040

41-
## 🔧 Options
41+
## :wrench: Options
4242

4343
Nothing.
4444

45-
## 👫 Related rules
45+
## :couple: Related rules
4646

4747
- [no-parsing-error]
4848

docs/rules/no-invalid-v-cloak.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,15 @@
22

33
This rule checks whether every `v-cloak` directive is valid.
44

5-
## 📖 Rule Details
5+
## :book: Rule Details
66

77
This rule reports `v-cloak` directives in the following cases:
88

99
- The directive has that argument. E.g. `<div v-cloak:aaa></div>`
1010
- The directive has that modifier. E.g. `<div v-cloak.bbb></div>`
1111
- The directive has that attribute value. E.g. `<div v-cloak="ccc"></div>`
1212

13-
👎 Examples of **incorrect** code for this rule:
13+
:-1: Examples of **incorrect** code for this rule:
1414

1515
```html
1616
<template>
@@ -22,7 +22,7 @@ This rule reports `v-cloak` directives in the following cases:
2222
</template>
2323
```
2424

25-
👍 Examples of **correct** code for this rule:
25+
:+1: Examples of **correct** code for this rule:
2626

2727
```html
2828
<template>
@@ -32,6 +32,6 @@ This rule reports `v-cloak` directives in the following cases:
3232
</template>
3333
```
3434

35-
## 🔧 Options
35+
## :wrench: Options
3636

3737
Nothing.

docs/rules/no-invalid-v-else-if.md

+5-5
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
This rule checks whether every `v-else-if` directive is valid.
44

5-
## 📖 Rule Details
5+
## :book: Rule Details
66

77
This rule reports `v-else-if` directives in the following cases:
88

@@ -14,7 +14,7 @@ This rule reports `v-else-if` directives in the following cases:
1414

1515
This rule does not check syntax errors in directives because it's checked by [no-parsing-error] rule.
1616

17-
👎 Examples of **incorrect** code for this rule:
17+
:-1: Examples of **incorrect** code for this rule:
1818

1919
```html
2020
<template>
@@ -26,7 +26,7 @@ This rule does not check syntax errors in directives because it's checked by [no
2626
</template>
2727
```
2828

29-
👍 Examples of **correct** code for this rule:
29+
:+1: Examples of **correct** code for this rule:
3030

3131
```html
3232
<template>
@@ -37,11 +37,11 @@ This rule does not check syntax errors in directives because it's checked by [no
3737
</template>
3838
```
3939

40-
## 🔧 Options
40+
## :wrench: Options
4141

4242
Nothing.
4343

44-
## 👫 Related rules
44+
## :couple: Related rules
4545

4646
- [no-invalid-v-if]
4747
- [no-invalid-v-else]

docs/rules/no-invalid-v-else.md

+5-5
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
This rule checks whether every `v-else` directive is valid.
44

5-
## 📖 Rule Details
5+
## :book: Rule Details
66

77
This rule reports `v-else` directives in the following cases:
88

@@ -12,7 +12,7 @@ This rule reports `v-else` directives in the following cases:
1212
- The directive is on the elements that the previous element don't have `v-if`/`v-if-else` directives. E.g. `<div v-else></div>`
1313
- The directive is on the elements which have `v-if`/`v-if-else` directives. E.g. `<div v-if="foo" v-else></div>`
1414

15-
👎 Examples of **incorrect** code for this rule:
15+
:-1: Examples of **incorrect** code for this rule:
1616

1717
```html
1818
<template>
@@ -24,7 +24,7 @@ This rule reports `v-else` directives in the following cases:
2424
</template>
2525
```
2626

27-
👍 Examples of **correct** code for this rule:
27+
:+1: Examples of **correct** code for this rule:
2828

2929
```html
3030
<template>
@@ -35,11 +35,11 @@ This rule reports `v-else` directives in the following cases:
3535
</template>
3636
```
3737

38-
## 🔧 Options
38+
## :wrench: Options
3939

4040
Nothing.
4141

42-
## 👫 Related rules
42+
## :couple: Related rules
4343

4444
- [no-invalid-v-if]
4545
- [no-invalid-v-else-if]

0 commit comments

Comments
 (0)