Skip to content

Commit 06b871d

Browse files
FloEdelmannFloEdelmann
authored
Merge branch 'master' into master
2 parents 1a3d658 + d77fbf7 commit 06b871d

26 files changed

+956
-56
lines changed

‎docs/rules/define-macros-order.md

Lines changed: 37 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,20 +2,20 @@
22
pageClass: rule-details
33
sidebarDepth: 0
44
title: vue/define-macros-order
5-
description: enforce order of `defineEmits` and `defineProps` compiler macros
5+
description: enforce order of compiler macros (`defineProps`, `defineEmits`, etc.)
66
since: v8.7.0
77
---
88

99
# vue/define-macros-order
1010

11-
> enforce order of `defineEmits` and `defineProps` compiler macros
11+
> enforce order of compiler macros (`defineProps`, `defineEmits`, etc.)
1212
1313
- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.
1414
- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
1515

1616
## :book: Rule Details
1717

18-
This rule reports the `defineProps` and `defineEmits` compiler macros when they are not the first statements in `<script setup>` (after any potential import statements or type definitions) or when they are not in the correct order.
18+
This rule reports compiler macros (like `defineProps` or `defineEmits` but also custom ones) when they are not the first statements in `<script setup>` (after any potential import statements or type definitions) or when they are not in the correct order.
1919

2020
## :wrench: Options
2121

@@ -28,7 +28,7 @@ This rule reports the `defineProps` and `defineEmits` compiler macros when they
2828
}
2929
```
3030

31-
- `order` (`string[]`) ... The order of defineEmits and defineProps macros. You can also add `"defineOptions"`, `"defineSlots"`, and `"defineModel"`.
31+
- `order` (`string[]`) ... The order in which the macros should appear. The default is `["defineProps", "defineEmits"]`.
3232
- `defineExposeLast` (`boolean`) ... Force `defineExpose` at the end.
3333

3434
### `{ "order": ["defineProps", "defineEmits"] }` (default)
@@ -118,6 +118,39 @@ const slots = defineSlots()
118118

119119
</eslint-code-block>
120120

121+
### `{ "order": ["definePage", "defineModel", "defineCustom", "defineEmits", "defineSlots"] }`
122+
123+
<eslint-code-block fix :rules="{'vue/define-macros-order': ['error', {order: ['definePage', 'defineModel', 'defineCustom', 'defineEmits', 'defineSlots']}]}">
124+
125+
```vue
126+
<!-- ✓ GOOD -->
127+
<script setup>
128+
definePage()
129+
const model = defineModel()
130+
defineCustom()
131+
defineEmits(/* ... */)
132+
const slots = defineSlots()
133+
</script>
134+
```
135+
136+
</eslint-code-block>
137+
138+
<eslint-code-block fix :rules="{'vue/define-macros-order': ['error', {order: ['definePage', 'defineModel', 'defineCustom', 'defineEmits', 'defineSlots']}]}">
139+
140+
```vue
141+
<!-- ✗ BAD -->
142+
<script setup>
143+
defineEmits(/* ... */)
144+
const slots = defineSlots()
145+
defineProps(/* ... */)
146+
defineCustom({/* ... */})
147+
const model = defineModel()
148+
definePage()
149+
</script>
150+
```
151+
152+
</eslint-code-block>
153+
121154
### `{ "defineExposeLast": true }`
122155

123156
<eslint-code-block fix :rules="{'vue/define-macros-order': ['error', {defineExposeLast: true}]}">

‎docs/rules/define-props-declaration.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ const props = defineProps({
4747

4848
### `"runtime"`
4949

50-
<eslint-code-block :rules="{'vue/define-emits-declaration': ['error', 'runtime']}">
50+
<eslint-code-block :rules="{'vue/define-props-declaration': ['error', 'runtime']}">
5151

5252
```vue
5353
<script setup lang="ts">

‎docs/rules/index.md

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -213,7 +213,7 @@ For example:
213213
| [vue/component-options-name-casing](./component-options-name-casing.md) | enforce the casing of component name in `components` options | :wrench::bulb: | :hammer: |
214214
| [vue/custom-event-name-casing](./custom-event-name-casing.md) | enforce specific casing for custom event name | | :hammer: |
215215
| [vue/define-emits-declaration](./define-emits-declaration.md) | enforce declaration style of `defineEmits` | | :hammer: |
216-
| [vue/define-macros-order](./define-macros-order.md) | enforce order of `defineEmits` and `defineProps` compiler macros | :wrench::bulb: | :lipstick: |
216+
| [vue/define-macros-order](./define-macros-order.md) | enforce order of compiler macros (`defineProps`, `defineEmits`, etc.) | :wrench::bulb: | :lipstick: |
217217
| [vue/define-props-declaration](./define-props-declaration.md) | enforce declaration style of `defineProps` | | :hammer: |
218218
| [vue/enforce-style-attribute](./enforce-style-attribute.md) | enforce or forbid the use of the `scoped` and `module` attributes in SFC top level style tags | | :hammer: |
219219
| [vue/html-button-has-type](./html-button-has-type.md) | disallow usage of button without an explicit type attribute | | :hammer: |
@@ -224,6 +224,7 @@ For example:
224224
| [vue/match-component-import-name](./match-component-import-name.md) | require the registered component name to match the imported component name | | :warning: |
225225
| [vue/max-lines-per-block](./max-lines-per-block.md) | enforce maximum number of lines in Vue SFC blocks | | :warning: |
226226
| [vue/max-props](./max-props.md) | enforce maximum number of props in Vue component | | :warning: |
227+
| [vue/max-template-depth](./max-template-depth.md) | enforce maximum depth of template | | :warning: |
227228
| [vue/new-line-between-multi-line-property](./new-line-between-multi-line-property.md) | enforce new lines between multi-line properties in Vue components | :wrench: | :lipstick: |
228229
| [vue/next-tick-style](./next-tick-style.md) | enforce Promise or callback style in `nextTick` | :wrench: | :hammer: |
229230
| [vue/no-bare-strings-in-template](./no-bare-strings-in-template.md) | disallow the use of bare strings in `<template>` | | :hammer: |
@@ -310,7 +311,7 @@ The following rules extend the rules provided by ESLint itself and apply them to
310311
| [vue/dot-notation](./dot-notation.md) | Enforce dot notation whenever possible in `<template>` | :wrench: | :hammer: |
311312
| [vue/eqeqeq](./eqeqeq.md) | Require the use of `===` and `!==` in `<template>` | :wrench: | :hammer: |
312313
| [vue/func-call-spacing](./func-call-spacing.md) | Require or disallow spacing between function identifiers and their invocations in `<template>` | :wrench: | :lipstick: |
313-
| [vue/key-spacing](./key-spacing.md) | Enforce consistent spacing between keys and values in object literal properties in `<template>` | :wrench: | :lipstick: |
314+
| [vue/key-spacing](./key-spacing.md) | Enforce consistent spacing between property names and type annotations in types and interfaces in `<template>` | :wrench: | :lipstick: |
314315
| [vue/keyword-spacing](./keyword-spacing.md) | Enforce consistent spacing before and after keywords in `<template>` | :wrench: | :lipstick: |
315316
| [vue/max-len](./max-len.md) | enforce a maximum line length in `.vue` files | | :lipstick: |
316317
| [vue/multiline-ternary](./multiline-ternary.md) | Enforce newlines between operands of ternary expressions in `<template>` | :wrench: | :lipstick: |
@@ -329,7 +330,7 @@ The following rules extend the rules provided by ESLint itself and apply them to
329330
| [vue/object-shorthand](./object-shorthand.md) | Require or disallow method and property shorthand syntax for object literals in `<template>` | :wrench: | :hammer: |
330331
| [vue/operator-linebreak](./operator-linebreak.md) | Enforce consistent linebreak style for operators in `<template>` | :wrench: | :lipstick: |
331332
| [vue/prefer-template](./prefer-template.md) | Require template literals instead of string concatenation in `<template>` | :wrench: | :hammer: |
332-
| [vue/quote-props](./quote-props.md) | Require quotes around object literal property names in `<template>` | :wrench: | :lipstick: |
333+
| [vue/quote-props](./quote-props.md) | Require quotes around object literal, type literal, interfaces and enums property names in `<template>` | :wrench: | :lipstick: |
333334
| [vue/space-in-parens](./space-in-parens.md) | Enforce consistent spacing inside parentheses in `<template>` | :wrench: | :lipstick: |
334335
| [vue/space-infix-ops](./space-infix-ops.md) | Require spacing around infix operators in `<template>` | :wrench: | :lipstick: |
335336
| [vue/space-unary-ops](./space-unary-ops.md) | Enforce consistent spacing before or after unary operators in `<template>` | :wrench: | :lipstick: |

‎docs/rules/key-spacing.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,13 @@
22
pageClass: rule-details
33
sidebarDepth: 0
44
title: vue/key-spacing
5-
description: Enforce consistent spacing between keys and values in object literal properties in `<template>`
5+
description: Enforce consistent spacing between property names and type annotations in types and interfaces in `<template>`
66
since: v5.2.0
77
---
88

99
# vue/key-spacing
1010

11-
> Enforce consistent spacing between keys and values in object literal properties in `<template>`
11+
> Enforce consistent spacing between property names and type annotations in types and interfaces in `<template>`
1212
1313
- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.
1414

‎docs/rules/max-props.md

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,13 @@ pageClass: rule-details
33
sidebarDepth: 0
44
title: vue/max-props
55
description: enforce maximum number of props in Vue component
6+
since: v9.28.0
67
---
78

89
# vue/max-props
910

1011
> enforce maximum number of props in Vue component
1112
12-
- :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> _**This rule has not been released yet.**_ </badge>
13-
1413
## :book: Rule Details
1514

1615
This rule enforces a maximum number of props in a Vue SFC, in order to aid in maintainability and reduce complexity.
@@ -56,6 +55,10 @@ defineProps({
5655

5756
</eslint-code-block>
5857

58+
## :rocket: Version
59+
60+
This rule was introduced in eslint-plugin-vue v9.28.0
61+
5962
## :mag: Implementation
6063

6164
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/max-props.js)

‎docs/rules/max-template-depth.md

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
---
2+
pageClass: rule-details
3+
sidebarDepth: 0
4+
title: vue/max-template-depth
5+
description: enforce maximum depth of template
6+
since: v9.28.0
7+
---
8+
9+
# vue/max-template-depth
10+
11+
> enforce maximum depth of template
12+
13+
## :book: Rule Details
14+
15+
This rule enforces a maximum depth of the template in a Vue SFC, in order to aid in maintainability and reduce complexity.
16+
17+
## :wrench: Options
18+
19+
This rule takes an object, where you can specify the maximum depth allowed in a Vue SFC template block.
20+
There is one property that can be specified for the object.
21+
22+
- `maxDepth` ... Specify the maximum template depth `template` block.
23+
24+
### `{ maxDepth: 3 }`
25+
26+
<eslint-code-block :rules="{'vue/max-template-depth': ['error', { maxDepth: 3 }]}">
27+
28+
```vue
29+
<!-- ✗ BAD -->
30+
<template>
31+
<main-container>
32+
<child-component>
33+
<div />
34+
</child-component>
35+
<child-component>
36+
<nested-component>
37+
<div>
38+
<div />
39+
</div>
40+
</nested-component>
41+
</child-component>
42+
</main-container>
43+
</template>
44+
```
45+
46+
</eslint-code-block>
47+
48+
<eslint-code-block :rules="{'vue/max-template-depth': ['error', { maxDepth: 3 }]}">
49+
50+
```vue
51+
<!-- ✓ GOOD -->
52+
<template>
53+
<main-container>
54+
<child-component>
55+
<div />
56+
</child-component>
57+
</main-container>
58+
</template>
59+
```
60+
61+
</eslint-code-block>
62+
63+
## :rocket: Version
64+
65+
This rule was introduced in eslint-plugin-vue v9.28.0
66+
67+
## :mag: Implementation
68+
69+
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/max-template-depth.js)
70+
- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/max-template-depth.js)

‎docs/rules/no-template-shadow.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ This rule takes one optional object option, with the property `"allow"`.
5555

5656
```json
5757
{
58-
"no-template-shadow": ["error", { "allow": [] }]
58+
"vue/no-template-shadow": ["error", { "allow": [] }]
5959
}
6060
```
6161

‎docs/rules/quote-props.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,13 @@
22
pageClass: rule-details
33
sidebarDepth: 0
44
title: vue/quote-props
5-
description: Require quotes around object literal property names in `<template>`
5+
description: Require quotes around object literal, type literal, interfaces and enums property names in `<template>`
66
since: v8.4.0
77
---
88

99
# vue/quote-props
1010

11-
> Require quotes around object literal property names in `<template>`
11+
> Require quotes around object literal, type literal, interfaces and enums property names in `<template>`
1212
1313
- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.
1414

‎docs/rules/require-default-export.md

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,13 @@ pageClass: rule-details
33
sidebarDepth: 0
44
title: vue/require-default-export
55
description: require components to be the default export
6+
since: v9.28.0
67
---
78

89
# vue/require-default-export
910

1011
> require components to be the default export
1112
12-
- :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> _**This rule has not been released yet.**_ </badge>
13-
1413
## :book: Rule Details
1514

1615
This rule reports when a Vue component does not have a default export, if the component is not defined as `<script setup>`.
@@ -51,6 +50,10 @@ Nothing.
5150

5251
- [vue/one-component-per-file](./one-component-per-file.md)
5352

53+
## :rocket: Version
54+
55+
This rule was introduced in eslint-plugin-vue v9.28.0
56+
5457
## :mag: Implementation
5558

5659
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/require-default-export.js)

‎docs/rules/require-toggle-inside-transition.md

Lines changed: 28 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,34 @@ This rule reports elements inside `<transition>` that do not control the display
3333

3434
## :wrench: Options
3535

36-
Nothing.
36+
```json
37+
{
38+
"vue/require-toggle-inside-transition": ["error", {
39+
"additionalDirectives": []
40+
}]
41+
}
42+
```
43+
44+
- `additionalDirectives` (`string[]`) ... Custom directives which will satisfy this rule in addition to `v-show` and `v-if`. Should be added without the `v-` prefix.
45+
46+
### `additionalDirectives: ["dialog"]`
47+
48+
<eslint-code-block :rules="{'vue/require-toggle-inside-transition': ['error', {additionalDirectives: ['dialog']}]}">
49+
50+
```vue
51+
<template>
52+
<!-- ✓ GOOD -->
53+
<transition><div v-if="show" /></transition>
54+
<transition><div v-show="show" /></transition>
55+
<transition><dialog v-dialog="show" /></transition>
56+
57+
<!-- ✗ BAD -->
58+
<transition><div /></transition>
59+
<transition><div v-custom="show" /></transition>
60+
<template>
61+
```
62+
63+
</eslint-code-block>
3764

3865
## :books: Further Reading
3966

0 commit comments

Comments
 (0)