Skip to content

Commit 021fe2b

Browse files
authored
Add vue/no-deprecated-v-is rule (#1510)
1 parent 76f835a commit 021fe2b

File tree

5 files changed

+111
-0
lines changed

5 files changed

+111
-0
lines changed

docs/rules/README.md

+1
Original file line numberDiff line numberDiff line change
@@ -298,6 +298,7 @@ For example:
298298
| [vue/next-tick-style](./next-tick-style.md) | enforce Promise or callback style in `nextTick` | :wrench: |
299299
| [vue/no-bare-strings-in-template](./no-bare-strings-in-template.md) | disallow the use of bare strings in `<template>` | |
300300
| [vue/no-boolean-default](./no-boolean-default.md) | disallow boolean defaults | :wrench: |
301+
| [vue/no-deprecated-v-is](./no-deprecated-v-is.md) | disallow deprecated `v-is` directive (in Vue.js 3.1.0+) | :wrench: |
301302
| [vue/no-duplicate-attr-inheritance](./no-duplicate-attr-inheritance.md) | enforce `inheritAttrs` to be set to `false` when using `v-bind="$attrs"` | |
302303
| [vue/no-empty-component-block](./no-empty-component-block.md) | disallow the `<template>` `<script>` `<style>` block to be empty | |
303304
| [vue/no-invalid-model-keys](./no-invalid-model-keys.md) | require valid keys in model option | |

docs/rules/no-deprecated-v-is.md

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
---
2+
pageClass: rule-details
3+
sidebarDepth: 0
4+
title: vue/no-deprecated-v-is
5+
description: disallow deprecated `v-is` directive (in Vue.js 3.1.0+)
6+
---
7+
# vue/no-deprecated-v-is
8+
9+
> disallow deprecated `v-is` directive (in Vue.js 3.1.0+)
10+
11+
- :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> ***This rule has not been released yet.*** </badge>
12+
- :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.
13+
14+
## :book: Rule Details
15+
16+
This rule reports deprecated `v-is` directive in Vue.js v3.1.0+.
17+
18+
Use [`is` attribute with `vue:` prefix](https://v3.vuejs.org/api/special-attributes.html#is) instead.
19+
20+
<eslint-code-block fix :rules="{'vue/no-deprecated-v-is': ['error']}">
21+
22+
```vue
23+
<template>
24+
<!-- ✓ GOOD -->
25+
<div is="vue:MyComponent" />
26+
<component is="MyComponent" />
27+
28+
<!-- ✗ BAD -->
29+
<div v-is="'MyComponent'" />
30+
</template>
31+
```
32+
33+
</eslint-code-block>
34+
35+
## :books: Further Reading
36+
37+
- [v-is](https://v3.vuejs.org/api/directives.html#v-is)
38+
39+
## :mag: Implementation
40+
41+
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-deprecated-v-is.js)
42+
- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-deprecated-v-is.js)

lib/index.js

+1
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,7 @@ module.exports = {
7171
'no-deprecated-slot-attribute': require('./rules/no-deprecated-slot-attribute'),
7272
'no-deprecated-slot-scope-attribute': require('./rules/no-deprecated-slot-scope-attribute'),
7373
'no-deprecated-v-bind-sync': require('./rules/no-deprecated-v-bind-sync'),
74+
'no-deprecated-v-is': require('./rules/no-deprecated-v-is'),
7475
'no-deprecated-v-on-native-modifier': require('./rules/no-deprecated-v-on-native-modifier'),
7576
'no-deprecated-v-on-number-modifiers': require('./rules/no-deprecated-v-on-number-modifiers'),
7677
'no-deprecated-vue-config-keycodes': require('./rules/no-deprecated-vue-config-keycodes'),

lib/rules/no-deprecated-v-is.js

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
/**
2+
* @author Yosuke Ota
3+
* See LICENSE file in root directory for full license.
4+
*/
5+
'use strict'
6+
7+
const utils = require('../utils')
8+
const vIs = require('./syntaxes/v-is')
9+
10+
module.exports = {
11+
meta: {
12+
type: 'suggestion',
13+
docs: {
14+
description: 'disallow deprecated `v-is` directive (in Vue.js 3.1.0+)',
15+
// TODO Switch to `vue3-essential` in the major version.
16+
// categories: ['vue3-essential'],
17+
categories: undefined,
18+
url: 'https://eslint.vuejs.org/rules/no-deprecated-v-is.html'
19+
},
20+
fixable: 'code',
21+
schema: [],
22+
messages: {
23+
forbiddenVIs: '`v-is` directive is deprecated.'
24+
}
25+
},
26+
/** @param {RuleContext} context */
27+
create(context) {
28+
const templateBodyVisitor = vIs.createTemplateBodyVisitor(context)
29+
return utils.defineTemplateBodyVisitor(context, templateBodyVisitor)
30+
}
31+
}

tests/lib/rules/no-deprecated-v-is.js

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
'use strict'
2+
3+
const RuleTester = require('eslint').RuleTester
4+
const rule = require('../../../lib/rules/no-deprecated-v-is')
5+
6+
const tester = new RuleTester({
7+
parser: require.resolve('vue-eslint-parser'),
8+
parserOptions: {
9+
ecmaVersion: 2015
10+
}
11+
})
12+
13+
tester.run('no-deprecated-v-is', rule, {
14+
valid: [
15+
`<template>
16+
<div is="vue:MyComponent" />
17+
</template>`,
18+
`<template>
19+
<component is="MyComponent" />
20+
</template>`
21+
],
22+
invalid: [
23+
{
24+
code: `
25+
<template>
26+
<div v-is="'MyComponent'" />
27+
</template>`,
28+
errors: [
29+
{
30+
message: '`v-is` directive is deprecated.',
31+
line: 3
32+
}
33+
]
34+
}
35+
]
36+
})

0 commit comments

Comments
 (0)