chore: introduce @eslint/markdown and eslint-plugin-markdown-preferences

.vscode/settings.json

@@ -1,7 +1,6 @@
 {
   "editor.tabSize": 2,
-  "eslint.experimental.useFlatConfig": true,
-  "eslint.validate": ["javascript", "javascriptreact", "vue", "json", "jsonc"],
+  "eslint.validate": ["javascript", "javascriptreact", "vue", "json", "jsonc", "markdown"],
   "typescript.tsdk": "./node_modules/typescript/lib",
   "vetur.validation.script": false,
   "[typescript]": {

CHANGELOG.md

@@ -12,7 +12,7 @@
 
 ### Patch Changes
 
-- Resolved TypeScript compatibility issues introduced by eslint-typegen ([#2790](https://github.com/vuejs/eslint-plugin-vue/pull/2790))
+- Resolved TypeScript compatibility issues introduced by [eslint-typegen](https://github.com/antfu/eslint-typegen) ([#2790](https://github.com/vuejs/eslint-plugin-vue/pull/2790))
 
 - Fixed inconsistent quotes in [`vue/block-lang`](https://eslint.vuejs.org/rules/block-lang.html) error messages ([#2805](https://github.com/vuejs/eslint-plugin-vue/pull/2805))
 

README.md

@@ -34,13 +34,13 @@ Contributing is welcome! See the [ESLint Vue Plugin Developer Guide](https://esl
 
 Be sure to read the [official ESLint guide](https://eslint.org/docs/developer-guide/working-with-rules) before you start writing a new rule.
 
-To see what an abstract syntax tree (AST) of your code looks like, you may use [AST Explorer](https://astexplorer.net). After opening [AST Explorer](https://astexplorer.net), select `Vue` as the syntax and `vue-eslint-parser` as the parser.
+To see what an abstract syntax tree (AST) of your code looks like, you may use [AST Explorer](https://astexplorer.net). After opening [AST Explorer](https://astexplorer.net), select `Vue` as the syntax and [`vue-eslint-parser`](https://github.com/vuejs/vue-eslint-parser) as the parser.
 
 The default JavaScript parser must be replaced because [Vue.js single file components](https://vuejs.org/guide/scaling-up/sfc.html) are not plain JavaScript, but a custom file format. [`vue-eslint-parser`](https://github.com/vuejs/vue-eslint-parser) is a replacement parser that generates an enhanced AST with nodes that represent specific parts of the template syntax, as well as the contents of the `<script>` tag.
 
 To learn more about certain nodes in a produced AST, see the [ESTree project page](https://github.com/estree/estree) and the [vue-eslint-parser AST documentation](https://github.com/vuejs/vue-eslint-parser/blob/master/docs/ast.md).
 
-`vue-eslint-parser` provides a few useful parser services to help traverse the produced AST and access template tokens:
+[`vue-eslint-parser`](https://github.com/vuejs/vue-eslint-parser) provides a few useful parser services to help traverse the produced AST and access template tokens:
 
 - `context.parserServices.defineTemplateBodyVisitor(visitor, scriptVisitor)`
 - `context.parserServices.getTemplateBodyTokenStore()`

docs/developer-guide/index.md

@@ -39,18 +39,18 @@ Before you start writing new rule, please read the [official ESLint guide](https
 Next, in order to get an idea how does the AST of the code that you want to check looks like, use the [astexplorer.net].
 The [astexplorer.net] is a great tool to inspect ASTs, also Vue templates are supported.
 
-After opening [astexplorer.net], select `Vue` as the syntax and `vue-eslint-parser` as the parser.
+After opening [astexplorer.net], select `Vue` as the syntax and [`vue-eslint-parser`](https://github.com/vuejs/vue-eslint-parser) as the parser.
 
 [astexplorer.net]: https://astexplorer.net/
 
-Since single file components in Vue are not plain JavaScript, we can't use the default parser, and we had to introduce additional one: `vue-eslint-parser`, that generates enhanced AST with nodes that represent specific parts of the template syntax, as well as what's inside the `<script>` tag.
+Since single file components in Vue are not plain JavaScript, we can't use the default parser, and we had to introduce additional one: [`vue-eslint-parser`](https://github.com/vuejs/vue-eslint-parser), that generates enhanced AST with nodes that represent specific parts of the template syntax, as well as what's inside the `<script>` tag.
 
 To know more about certain nodes in produced ASTs, go here:
 
 - [ESTree docs](https://github.com/estree/estree)
 - [vue-eslint-parser AST docs](https://github.com/vuejs/vue-eslint-parser/blob/master/docs/ast.md)
 
-The `vue-eslint-parser` provides few useful parser services, to help traverse the produced AST and access tokens of the template:
+The [`vue-eslint-parser`](https://github.com/vuejs/vue-eslint-parser) provides few useful parser services, to help traverse the produced AST and access tokens of the template:
 
 - `context.parserServices.defineTemplateBodyVisitor(visitor, scriptVisitor)`
 - `context.parserServices.getTemplateBodyTokenStore()`
@@ -63,7 +63,7 @@ If you'll stuck, remember there are plenty of rules you can learn from already,
 
 ## :white_check_mark: JSDoc type checking with TypeScript
 
-We have type checking enabled via TypeScript and JSDoc.  
+We have type checking enabled via TypeScript and JSDoc.\
 The command to perform type checking is: `npm run tsc`
 
 This is just to help you write the rules, not to do strict type checking. If you find it difficult to resolve type checking warnings, feel free to suppress warnings using the `// @ts-nocheck` and `// @ts-ignore` comment.

docs/rules/block-lang.md

@@ -48,14 +48,14 @@ This rule disallows the use of languages other than those available in the your
 
 </eslint-code-block>
 
-Specify the block name for the key of the option object.  
+Specify the block name for the key of the option object.\
 You can use the object as a value and use the following properties:
 
 - `lang` ... Specifies the available value for the `lang` attribute of the block. If multiple languages are available, specify them as an array. If you do not specify it, will disallow any language.
 - `allowNoLang` ... If `true`, allows the `lang` attribute not to be specified (allows the use of the default language of block).
 
 ::: warning Note
-If the default language is specified for `lang` option of `<template>`, `<style>` and `<script>`, it will be enforced to not specify `lang` attribute.  
+If the default language is specified for `lang` option of `<template>`, `<style>` and `<script>`, it will be enforced to not specify `lang` attribute.\
 This is to prevent unintended problems with [Vetur](https://vuejs.github.io/vetur/).
 
 See also [Vetur - Syntax Highlighting](https://vuejs.github.io/vetur/guide/highlighting.html).

docs/rules/component-api-style.md

@@ -14,7 +14,7 @@ since: v7.18.0
 
 This rule aims to make the API style you use to define Vue components consistent in your project.
 
-For example, if you want to allow only `<script setup>` and Composition API.  
+For example, if you want to allow only `<script setup>` and Composition API.\
 (This is the default for this rule.)
 
 <eslint-code-block :rules="{'vue/component-api-style': ['error']}">

docs/rules/html-indent.md

@@ -79,7 +79,7 @@ This rule enforces a consistent indentation style in `<template>`. The default s
 - `type` (`number | "tab"`) ... The type of indentation. Default is `2`. If this is a number, it's the number of spaces for one indent. If this is `"tab"`, it uses one tab for one indent.
 - `attribute` (`integer`) ... The multiplier of indentation for attributes. Default is `1`.
 - `baseIndent` (`integer`) ... The multiplier of indentation for top-level statements. Default is `1`.
-- `closeBracket` (`integer | object`) ... The multiplier of indentation for right brackets. Default is `0`.  
+- `closeBracket` (`integer | object`) ... The multiplier of indentation for right brackets. Default is `0`.\
   You can apply all of the following by setting a number value.
   - `closeBracket.startTag` (`integer`) ... The multiplier of indentation for right brackets of start tags (`<div>`). Default is `0`.
   - `closeBracket.endTag` (`integer`) ... The multiplier of indentation for right brackets of end tags (`</div>`). Default is `0`.

docs/rules/multiline-html-element-content-newline.md

@@ -91,7 +91,7 @@ This rule enforces a line break before and after the contents of a multiline ele
     default `true`
 - `ignores` ... the configuration for element names to ignore line breaks style.
     default `["pre", "textarea", ...INLINE_ELEMENTS]`.
-- `allowEmptyLines` ... if `true`, it allows empty lines around content. If you want to disallow multiple empty lines, use [no-multiple-empty-lines] in combination.  
+- `allowEmptyLines` ... if `true`, it allows empty lines around content. If you want to disallow multiple empty lines, use [no-multiple-empty-lines] in combination.\
     default `false`
 
 ::: info
@@ -146,7 +146,9 @@ This rule enforces a line break before and after the contents of a multiline ele
 ## :couple: Related Rules
 
 - [vue/singleline-html-element-content-newline](./singleline-html-element-content-newline.md)
-- [no-multiple-empty-lines](https://eslint.org/docs/rules/no-multiple-empty-lines)
+- [no-multiple-empty-lines]
+
+[no-multiple-empty-lines]: https://eslint.org/docs/rules/no-multiple-empty-lines
 
 ## :rocket: Version
 

docs/rules/no-async-in-computed-properties.md

@@ -112,7 +112,9 @@ Nothing.
 
 ## :books: Further Reading
 
-- [vue-async-computed](https://github.com/foxbenjaminfox/vue-async-computed)
+- [vue-async-computed]
+
+[vue-async-computed]: https://github.com/foxbenjaminfox/vue-async-computed
 
 ## :rocket: Version
 

docs/rules/no-computed-properties-in-data.md

@@ -14,7 +14,7 @@ since: v7.20.0
 
 ## :book: Rule Details
 
-This rule disallow accessing computed properties in `data()`.  
+This rule disallow accessing computed properties in `data()`.\
 The computed property cannot be accessed in `data()` because is before initialization.
 
 <eslint-code-block :rules="{'vue/no-computed-properties-in-data': ['error']}">

docs/rules/no-deprecated-data-object-declaration.md

@@ -16,7 +16,7 @@ since: v7.0.0
 ## :book: Rule Details
 
 This rule reports use of deprecated object declaration on `data` property (in Vue.js 3.0.0+).
-The different from `vue/no-shared-component-data` is the root instance being also disallowed.
+The different from [`vue/no-shared-component-data`](./no-shared-component-data.md) is the root instance being also disallowed.
 
 See [Migration Guide - Data Option](https://v3-migration.vuejs.org/breaking-changes/data-option.html) for more details.
 

docs/rules/no-duplicate-attr-inheritance.md

@@ -12,7 +12,7 @@ since: v7.0.0
 
 ## :book: Rule Details
 
-This rule aims to prevent duplicate attribute inheritance.  
+This rule aims to prevent duplicate attribute inheritance.\
 This rule suggests applying `inheritAttrs: false` when it detects `v-bind="$attrs"` being used.
 
 <eslint-code-block :rules="{'vue/no-duplicate-attr-inheritance': ['error', { checkMultiRootNodes: false }]}">

docs/rules/no-expose-after-await.md

@@ -14,8 +14,8 @@ since: v8.1.0
 
 ## :book: Rule Details
 
-This rule reports usages of `expose()` and `defineExpose()` after an `await` expression.  
-In the `setup()` function, `expose()` should be registered synchronously.  
+This rule reports usages of `expose()` and `defineExpose()` after an `await` expression.\
+In the `setup()` function, `expose()` should be registered synchronously.\
 In the `<script setup>`, `defineExpose()` should be registered synchronously.
 
 <eslint-code-block :rules="{'vue/no-expose-after-await': ['error']}">

docs/rules/no-extra-parens.md

@@ -21,7 +21,7 @@ However, if neither is found, the rule cannot be used.
 
 ## :book: Rule Details
 
-This rule restricts the use of parentheses to only where they are necessary.  
+This rule restricts the use of parentheses to only where they are necessary.\
 This rule extends the [@stylistic/no-extra-parens] rule and applies it to the `<template>`. This rule also checks some Vue.js syntax.
 
 <eslint-code-block fix :rules="{'vue/no-extra-parens': ['error']}">

docs/rules/no-lifecycle-after-await.md

@@ -14,7 +14,7 @@ since: v7.0.0
 
 ## :book: Rule Details
 
-This rule reports the lifecycle hooks after `await` expression.  
+This rule reports the lifecycle hooks after `await` expression.\
 In `setup()` function, `onXXX` lifecycle hooks should be registered synchronously.
 
 <eslint-code-block :rules="{'vue/no-lifecycle-after-await': ['error']}">

docs/rules/no-lone-template.md

@@ -14,8 +14,8 @@ since: v7.0.0
 
 ## :book: Rule Details
 
-This rule aims to eliminate unnecessary and potentially confusing `<template>`.  
-In Vue.js 2.x, the `<template>` elements that have no specific directives have no effect.  
+This rule aims to eliminate unnecessary and potentially confusing `<template>`.\
+In Vue.js 2.x, the `<template>` elements that have no specific directives have no effect.\
 In Vue.js 3.x, the `<template>` elements that have no specific directives render the `<template>` elements as is, but in most cases this may not be what you intended.
 
 <eslint-code-block :rules="{'vue/no-lone-template': ['error']}">
@@ -47,7 +47,7 @@ In Vue.js 3.x, the `<template>` elements that have no specific directives render
 }
 ```
 
-- `ignoreAccessible` ... If `true`, ignore accessible `<template>` elements. default `false`.  
+- `ignoreAccessible` ... If `true`, ignore accessible `<template>` elements. default `false`.\
   Note: this option is useless if you are using Vue.js 2.x.
 
 ### `"ignoreAccessible": true`

docs/rules/no-multiple-slot-args.md

@@ -14,7 +14,7 @@ since: v7.0.0
 
 ## :book: Rule Details
 
-This rule disallows to pass multiple arguments to scoped slots.  
+This rule disallows to pass multiple arguments to scoped slots.\
 In details, it reports call expressions if a call of `this.$scopedSlots` members has 2 or more arguments.
 
 <eslint-code-block :rules="{'vue/no-multiple-slot-args': ['error']}">

docs/rules/no-ref-as-operand.md

@@ -15,7 +15,7 @@ since: v7.0.0
 
 ## :book: Rule Details
 
-This rule reports cases where a ref is used incorrectly as an operand.  
+This rule reports cases where a ref is used incorrectly as an operand.\
 You must use `.value` to access the `Ref` value.
 
 <eslint-code-block fix :rules="{'vue/no-ref-as-operand': ['error']}">

docs/rules/no-ref-object-destructure.md

@@ -31,7 +31,7 @@ const v6 = computed(() => fn(count.value) /* ✓ GOOD */)
 
 </eslint-code-block>
 
-This rule also supports Reactivity Transform, but Reactivity Transform is an experimental feature and may have false positives due to future Vue changes.  
+This rule also supports Reactivity Transform, but Reactivity Transform is an experimental feature and may have false positives due to future Vue changes.\
 See the [RFC](https://github.com/vuejs/rfcs/pull/420) for more information on Reactivity Transform.
 
 <eslint-code-block :rules="{'vue/no-ref-object-destructure': ['error']}" language="javascript" filename="example.js" >

docs/rules/no-ref-object-reactivity-loss.md

@@ -29,7 +29,7 @@ const v6 = computed(() => fn(count.value) /* ✓ GOOD */)
 
 </eslint-code-block>
 
-This rule also supports Reactivity Transform, but Reactivity Transform is an experimental feature and may have false positives due to future Vue changes.  
+This rule also supports Reactivity Transform, but Reactivity Transform is an experimental feature and may have false positives due to future Vue changes.\
 See the [RFC](https://github.com/vuejs/rfcs/pull/420) for more information on Reactivity Transform.
 
 <eslint-code-block :rules="{'vue/no-ref-object-reactivity-loss': ['error']}" language="javascript" filename="example.js" >

docs/rules/no-undef-properties.md

@@ -12,11 +12,11 @@ since: v7.20.0
 
 ## :book: Rule Details
 
-This rule warns of using undefined properties.  
+This rule warns of using undefined properties.\
 This rule can help you locate potential errors resulting from misspellings property names, and implicitly added properties.
 
 ::: warning Note
-This rule cannot detect properties defined in other files or components.  
+This rule cannot detect properties defined in other files or components.\
 Note that there are many false positives if you are using mixins.
 :::
 

docs/rules/no-useless-mustaches.md

@@ -14,7 +14,7 @@ since: v7.0.0
 
 ## :book: Rule Details
 
-This rule reports mustache interpolation with a string literal value.  
+This rule reports mustache interpolation with a string literal value.\
 The mustache interpolation with a string literal value can be changed to a static contents.
 
 <eslint-code-block fix :rules="{'vue/no-useless-mustaches': ['error']}">

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

@@ -14,7 +14,7 @@ since: v7.0.0
 
 ## :book: Rule Details
 
-This rule reports `v-bind` with a string literal value.  
+This rule reports `v-bind` with a string literal value.\
 The `v-bind` with a string literal value can be changed to a static attribute definition.
 
 <eslint-code-block fix :rules="{'vue/no-useless-v-bind': ['error']}">

docs/rules/no-watch-after-await.md

@@ -14,7 +14,7 @@ since: v7.0.0
 
 ## :book: Rule Details
 
-This rule reports the `watch()` after `await` expression.  
+This rule reports the `watch()` after `await` expression.\
 In `setup()` function, `watch()` should be registered synchronously.
 
 <eslint-code-block :rules="{'vue/no-watch-after-await': ['error']}">

docs/rules/require-slots-as-functions.md

@@ -14,7 +14,7 @@ since: v7.0.0
 
 ## :book: Rule Details
 
-This rule enforces the properties of `$slots` to be used as a function.  
+This rule enforces the properties of `$slots` to be used as a function.\
 `this.$slots.default` was an array of VNode in Vue.js 2.x, but changed to a function that returns an array of VNode in Vue.js 3.x.
 
 <eslint-code-block :rules="{'vue/require-slots-as-functions': ['error']}">

docs/rules/script-setup-uses-vars.md

@@ -14,7 +14,7 @@ since: v7.13.0
 
 ::: tip
 
-This rule is not needed when using `vue-eslint-parser` v9.0.0 or later.
+This rule is not needed when using [`vue-eslint-parser`](https://github.com/vuejs/vue-eslint-parser) v9.0.0 or later.
 
 :::
 
@@ -56,7 +56,7 @@ After turning on, `Foo` is being marked as used and `no-unused-vars` rule doesn'
 
 You can disable this rule in any of the following cases:
 
-- You are using `vue-eslint-parser` v9.0.0 or later.
+- You are using [`vue-eslint-parser`](https://github.com/vuejs/vue-eslint-parser) v9.0.0 or later.
 - You are not using `<script setup>`.
 - You do not use the `no-unused-vars` rule.
 

docs/rules/v-slot-style.md

@@ -69,7 +69,7 @@ Each value means:
 - `"longform"` ... use `v-slot:` directive notation. E.g. `v-slot:default`, `v-slot:named`, ...
 - `"v-slot"` ... use `v-slot` without that argument. This is shorter than `#default` shorthand.
 
-And a string option is supported to be consistent to similar `vue/v-bind-style` and `vue/v-on-style`.
+And a string option is supported to be consistent to similar [`vue/v-bind-style`](./v-bind-style.md) and [`vue/v-on-style`](./v-on-style.md).
 
 - `["error", "longform"]` is same as `["error", { atComponent: "longform", default: "longform", named: "longform" }]`.
 - `["error", "shorthand"]` is same as `["error", { atComponent: "shorthand", default: "shorthand", named: "shorthand" }]`.