Skip to content

Commit 909106b

Browse files
committed
2 parents 3bc2921 + ab7b8b2 commit 909106b

17 files changed

+1188
-6
lines changed

docs/rules/define-macros-order.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ defineEmits(/* ... */)
6666

6767
</eslint-code-block>
6868

69-
### `{ "order": ["defineOptions", "defineProps", "defineEmits", "defineSlots"] }` (default)
69+
### `{ "order": ["defineOptions", "defineProps", "defineEmits", "defineSlots"] }`
7070

7171
<eslint-code-block fix :rules="{'vue/define-macros-order': ['error', {order: ['defineOptions', 'defineProps', 'defineEmits', 'defineSlots']}]}">
7272

docs/rules/index.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -221,6 +221,7 @@ For example:
221221
| [vue/html-comment-indent](./html-comment-indent.md) | enforce consistent indentation in HTML comments | :wrench: | :lipstick: |
222222
| [vue/match-component-file-name](./match-component-file-name.md) | require component name property to match its file name | :bulb: | :hammer: |
223223
| [vue/match-component-import-name](./match-component-import-name.md) | require the registered component name to match the imported component name | | :warning: |
224+
| [vue/max-lines-per-block](./max-lines-per-block.md) | enforce maximum number of lines in Vue SFC blocks | | :warning: |
224225
| [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: |
225226
| [vue/next-tick-style](./next-tick-style.md) | enforce Promise or callback style in `nextTick` | :wrench: | :hammer: |
226227
| [vue/no-bare-strings-in-template](./no-bare-strings-in-template.md) | disallow the use of bare strings in `<template>` | | :hammer: |
@@ -234,6 +235,7 @@ For example:
234235
| [vue/no-restricted-block](./no-restricted-block.md) | disallow specific block | | :hammer: |
235236
| [vue/no-restricted-call-after-await](./no-restricted-call-after-await.md) | disallow asynchronously called restricted methods | | :hammer: |
236237
| [vue/no-restricted-class](./no-restricted-class.md) | disallow specific classes in Vue components | | :warning: |
238+
| [vue/no-restricted-component-names](./no-restricted-component-names.md) | disallow specific component names | :bulb: | :hammer: |
237239
| [vue/no-restricted-component-options](./no-restricted-component-options.md) | disallow specific component option | | :hammer: |
238240
| [vue/no-restricted-custom-event](./no-restricted-custom-event.md) | disallow specific custom event | :bulb: | :hammer: |
239241
| [vue/no-restricted-html-elements](./no-restricted-html-elements.md) | disallow specific HTML elements | | :hammer: |
@@ -265,6 +267,7 @@ For example:
265267
| [vue/require-macro-variable-name](./require-macro-variable-name.md) | require a certain macro variable name | :bulb: | :hammer: |
266268
| [vue/require-name-property](./require-name-property.md) | require a name property in Vue components | :bulb: | :hammer: |
267269
| [vue/require-prop-comment](./require-prop-comment.md) | require props to have a comment | | :hammer: |
270+
| [vue/require-typed-ref](./require-typed-ref.md) | require `ref` and `shallowRef` functions to be strongly typed | | :hammer: |
268271
| [vue/script-indent](./script-indent.md) | enforce consistent indentation in `<script>` | :wrench: | :lipstick: |
269272
| [vue/sort-keys](./sort-keys.md) | enforce sort-keys in a manner that is compatible with order-in-components | | :hammer: |
270273
| [vue/static-class-names-order](./static-class-names-order.md) | enforce static class names order | :wrench: | :hammer: |

docs/rules/max-lines-per-block.md

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
---
2+
pageClass: rule-details
3+
sidebarDepth: 0
4+
title: vue/max-lines-per-block
5+
description: enforce maximum number of lines in Vue SFC blocks
6+
since: v9.15.0
7+
---
8+
# vue/max-lines-per-block
9+
10+
> enforce maximum number of lines in Vue SFC blocks
11+
12+
## :book: Rule Details
13+
14+
This rule enforces a maximum number of lines per block, in order to aid in maintainability and reduce complexity.
15+
16+
## :wrench: Options
17+
18+
This rule takes an object, where you can specify the maximum number of lines in each type of SFC block and customize the line counting behavior.
19+
The following properties can be specified for the object.
20+
21+
- `script` ... Specify the maximum number of lines in `<script>` block. Won't enforce limitation if not specified.
22+
- `template` ... Specify the maximum number of lines in `<template>` block. Won't enforce limitation if not specified.
23+
- `style` ... Specify the maximum number of lines in `<style>` block. Won't enforce limitation if not specified.
24+
- `skipBlankLines` ... Ignore lines made up purely of whitespaces.
25+
26+
### `{ template: 2 }`
27+
28+
<eslint-code-block :rules="{'vue/max-lines-per-block': ['error', { template: 2 }]}">
29+
30+
```vue
31+
<!-- ✗ BAD -->
32+
<template>
33+
<div>
34+
hi
35+
</div>
36+
</template>
37+
```
38+
39+
</eslint-code-block>
40+
41+
### `{ script: 1, skipBlankLines: true }`
42+
43+
<eslint-code-block :rules="{'vue/max-lines-per-block': ['error', { script: 1, skipBlankLines: true }]}">
44+
45+
```vue
46+
<!-- ✓ GOOD -->
47+
<script>
48+
49+
console.log(1)
50+
</script>
51+
```
52+
53+
</eslint-code-block>
54+
55+
## :rocket: Version
56+
57+
This rule was introduced in eslint-plugin-vue v9.15.0
58+
59+
## :mag: Implementation
60+
61+
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/max-lines-per-block.js)
62+
- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/max-lines-per-block.js)

docs/rules/no-console.md

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,12 @@ pageClass: rule-details
33
sidebarDepth: 0
44
title: vue/no-console
55
description: Disallow the use of `console` in `<template>`
6+
since: v9.15.0
67
---
78
# vue/no-console
89

910
> Disallow the use of `console` in `<template>`
1011
11-
- :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> ***This rule has not been released yet.*** </badge>
12-
1312
## :book: Rule Details
1413

1514
This rule is the same rule as core [no-console] rule but it applies to the expressions in `<template>`.
@@ -20,9 +19,13 @@ This rule is the same rule as core [no-console] rule but it applies to the expre
2019

2120
[no-console]: https://eslint.org/docs/latest/rules/no-console
2221

22+
## :rocket: Version
23+
24+
This rule was introduced in eslint-plugin-vue v9.15.0
25+
2326
## :mag: Implementation
2427

2528
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-console.js)
2629
- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-console.js)
2730

28-
<sup>Taken with ❤️ [from ESLint core](https://eslint.org/docs/rules/no-console)</sup>
31+
<sup>Taken with ❤️ [from ESLint core](https://eslint.org/docs/latest/rules/no-console)</sup>
Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
---
2+
pageClass: rule-details
3+
sidebarDepth: 0
4+
title: vue/no-restricted-component-names
5+
description: disallow specific component names
6+
since: v9.15.0
7+
---
8+
# vue/no-restricted-component-names
9+
10+
> disallow specific component names
11+
12+
- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
13+
14+
## :book: Rule Details
15+
16+
This rule allows you to specify component names that you don't want to use in your application.
17+
18+
<eslint-code-block :rules="{'vue/no-restricted-component-names': ['error', 'Disallow']}">
19+
20+
```vue
21+
<!-- ✗ BAD -->
22+
<script>
23+
export default {
24+
name: 'Disallow',
25+
}
26+
</script>
27+
```
28+
29+
</eslint-code-block>
30+
31+
<eslint-code-block :rules="{'vue/no-restricted-component-names': ['error', 'Disallow']}">
32+
33+
```vue
34+
<!-- ✓ GOOD -->
35+
<script>
36+
export default {
37+
name: 'Allow',
38+
}
39+
</script>
40+
```
41+
42+
</eslint-code-block>
43+
44+
## :wrench: Options
45+
46+
This rule takes a list of strings, where each string is a component name or pattern to be restricted:
47+
48+
```json
49+
{
50+
"vue/no-restricted-component-names": ["error", "foo", "/^Disallow/"]
51+
}
52+
```
53+
54+
Alternatively, you can specify an object with a `name` property and an optional `message` and `suggest` property:
55+
56+
```json
57+
{
58+
"vue/no-restricted-component-names": [
59+
"error",
60+
{
61+
"name": "Disallow",
62+
"message": "Please do not use `Disallow` as a component name",
63+
"suggest": "allow"
64+
},
65+
{
66+
"name": "/^custom/",
67+
"message": "Please do not use component names starting with 'custom'"
68+
}
69+
]
70+
}
71+
```
72+
73+
<eslint-code-block :rules="{'vue/no-restricted-component-names': ['error', { name: 'Disallow', message: 'Please do not use \'Disallow\' as a component name', suggest: 'allow'}]}">
74+
75+
```vue
76+
<!-- ✗ BAD -->
77+
<script>
78+
export default {
79+
name: 'Disallow',
80+
}
81+
</script>
82+
```
83+
84+
</eslint-code-block>
85+
86+
## :rocket: Version
87+
88+
This rule was introduced in eslint-plugin-vue v9.15.0
89+
90+
## :mag: Implementation
91+
92+
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-restricted-component-names.js)
93+
- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-restricted-component-names.js)

docs/rules/require-macro-variable-name.md

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,12 @@ pageClass: rule-details
33
sidebarDepth: 0
44
title: vue/require-macro-variable-name
55
description: require a certain macro variable name
6+
since: v9.15.0
67
---
78
# vue/require-macro-variable-name
89

910
> require a certain macro variable name
1011
11-
- :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> ***This rule has not been released yet.*** </badge>
1212
- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
1313

1414
## :book: Rule Details
@@ -78,6 +78,10 @@ const attrsCustom = useAttrs()
7878

7979
</eslint-code-block>
8080

81+
## :rocket: Version
82+
83+
This rule was introduced in eslint-plugin-vue v9.15.0
84+
8185
## :mag: Implementation
8286

8387
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/require-macro-variable-name.js)

docs/rules/require-typed-ref.md

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
---
2+
pageClass: rule-details
3+
sidebarDepth: 0
4+
title: vue/require-typed-ref
5+
description: require `ref` and `shallowRef` functions to be strongly typed
6+
since: v9.15.0
7+
---
8+
# vue/require-typed-ref
9+
10+
> require `ref` and `shallowRef` functions to be strongly typed
11+
12+
## :book: Rule Details
13+
14+
This rule disallows calling `ref()` or `shallowRef()` functions without generic type parameter or an argument when using TypeScript.
15+
16+
With TypeScript it is easy to prevent usage of `any` by using [`noImplicitAny`](https://www.typescriptlang.org/tsconfig#noImplicitAny). Unfortunately this rule is easily bypassed with Vue `ref()` function. Calling `ref()` function without a generic parameter or an initial value leads to ref having `Ref<any>` type.
17+
18+
<eslint-code-block :rules="{'vue/require-typed-ref': ['error']}">
19+
20+
```vue
21+
<script setup lang="ts">
22+
import { ref, shallowRef, type Ref } from 'vue'
23+
24+
/* ✗ BAD */
25+
const count = ref() // Returns Ref<any> that is not type checked
26+
count.value = '50' // Should be a type error, but it is not
27+
28+
const count = shallowRef()
29+
30+
/* ✓ GOOD */
31+
const count = ref<number>()
32+
const count = ref(0)
33+
const count: Ref<number | undefined> = ref()
34+
</script>
35+
```
36+
37+
</eslint-code-block>
38+
39+
## :wrench: Options
40+
41+
Nothing.
42+
43+
## :rocket: Version
44+
45+
This rule was introduced in eslint-plugin-vue v9.15.0
46+
47+
## :mag: Implementation
48+
49+
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/require-typed-ref.js)
50+
- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/require-typed-ref.js)

lib/index.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,7 @@ module.exports = {
5454
'match-component-import-name': require('./rules/match-component-import-name'),
5555
'max-attributes-per-line': require('./rules/max-attributes-per-line'),
5656
'max-len': require('./rules/max-len'),
57+
'max-lines-per-block': require('./rules/max-lines-per-block'),
5758
'multi-word-component-names': require('./rules/multi-word-component-names'),
5859
'multiline-html-element-content-newline': require('./rules/multiline-html-element-content-newline'),
5960
'multiline-ternary': require('./rules/multiline-ternary'),
@@ -118,6 +119,7 @@ module.exports = {
118119
'no-restricted-block': require('./rules/no-restricted-block'),
119120
'no-restricted-call-after-await': require('./rules/no-restricted-call-after-await'),
120121
'no-restricted-class': require('./rules/no-restricted-class'),
122+
'no-restricted-component-names': require('./rules/no-restricted-component-names'),
121123
'no-restricted-component-options': require('./rules/no-restricted-component-options'),
122124
'no-restricted-custom-event': require('./rules/no-restricted-custom-event'),
123125
'no-restricted-html-elements': require('./rules/no-restricted-html-elements'),
@@ -189,6 +191,7 @@ module.exports = {
189191
'require-render-return': require('./rules/require-render-return'),
190192
'require-slots-as-functions': require('./rules/require-slots-as-functions'),
191193
'require-toggle-inside-transition': require('./rules/require-toggle-inside-transition'),
194+
'require-typed-ref': require('./rules/require-typed-ref'),
192195
'require-v-for-key': require('./rules/require-v-for-key'),
193196
'require-valid-default-prop': require('./rules/require-valid-default-prop'),
194197
'return-in-computed-property': require('./rules/return-in-computed-property'),

0 commit comments

Comments
 (0)