Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
6 changed files
with
474 additions
and
11 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,133 @@ | ||
| --- | ||
| pageClass: rule-details | ||
| sidebarDepth: 0 | ||
| title: vue/valid-define-emits | ||
| description: enforce valid `defineEmits` compiler macro | ||
| --- | ||
| # vue/valid-define-emits | ||
|
|
||
| > enforce valid `defineEmits` compiler macro | ||
| - :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> ***This rule has not been released yet.*** </badge> | ||
|
|
||
| This rule checks whether `defineEmits` compiler macro is valid. | ||
|
|
||
| ## :book: Rule Details | ||
|
|
||
| This rule reports `defineEmits` compiler macros in the following cases: | ||
|
|
||
| - `defineEmits` are referencing locally declared variables. | ||
| - `defineEmits` has both a literal type and an argument. e.g. `defineEmits<(e: 'foo')=>void>(['bar'])` | ||
| - `defineEmits` has been called multiple times. | ||
| - Custom events are defined in both `defineEmits` and `export default {}`. | ||
| - Custom events are not defined in either `defineEmits` or `export default {}`. | ||
|
|
||
| <eslint-code-block :rules="{'vue/valid-define-emits': ['error']}"> | ||
|
|
||
| ```vue | ||
| <script setup> | ||
| /* ✓ GOOD */ | ||
| defineEmits({ notify: null }) | ||
| </script> | ||
| ``` | ||
|
|
||
| </eslint-code-block> | ||
|
|
||
| <eslint-code-block :rules="{'vue/valid-define-emits': ['error']}"> | ||
|
|
||
| ```vue | ||
| <script setup> | ||
| /* ✓ GOOD */ | ||
| defineEmits(['notify']) | ||
| </script> | ||
| ``` | ||
|
|
||
| </eslint-code-block> | ||
|
|
||
| ```vue | ||
| <script setup lang="ts"> | ||
| /* ✓ GOOD */ | ||
| defineEmits<(e: 'notify')=>void>() | ||
| </script> | ||
| ``` | ||
|
|
||
| <eslint-code-block :rules="{'vue/valid-define-emits': ['error']}"> | ||
|
|
||
| ```vue | ||
| <script> | ||
| const def = { notify: null } | ||
| </script> | ||
| <script setup> | ||
| /* ✓ GOOD */ | ||
| defineEmits(def) | ||
| </script> | ||
| ``` | ||
|
|
||
| </eslint-code-block> | ||
|
|
||
| <eslint-code-block :rules="{'vue/valid-define-emits': ['error']}"> | ||
|
|
||
| ```vue | ||
| <script setup> | ||
| /* ✗ BAD */ | ||
| const def = { notify: null } | ||
| defineEmits(def) | ||
| </script> | ||
| ``` | ||
|
|
||
| </eslint-code-block> | ||
|
|
||
| ```vue | ||
| <script setup lang="ts"> | ||
| /* ✗ BAD */ | ||
| defineEmits<(e: 'notify')=>void>({ submit: null }) | ||
| </script> | ||
| ``` | ||
|
|
||
| <eslint-code-block :rules="{'vue/valid-define-emits': ['error']}"> | ||
|
|
||
| ```vue | ||
| <script setup> | ||
| /* ✗ BAD */ | ||
| defineEmits({ notify: null }) | ||
| defineEmits({ submit: null }) | ||
| </script> | ||
| ``` | ||
|
|
||
| </eslint-code-block> | ||
|
|
||
| <eslint-code-block :rules="{'vue/valid-define-emits': ['error']}"> | ||
|
|
||
| ```vue | ||
| <script> | ||
| export default { | ||
| emits: { notify: null } | ||
| } | ||
| </script> | ||
| <script setup> | ||
| /* ✗ BAD */ | ||
| defineEmits({ submit: null }) | ||
| </script> | ||
| ``` | ||
|
|
||
| </eslint-code-block> | ||
|
|
||
| <eslint-code-block :rules="{'vue/valid-define-emits': ['error']}"> | ||
|
|
||
| ```vue | ||
| <script setup> | ||
| /* ✗ BAD */ | ||
| defineEmits() | ||
| </script> | ||
| ``` | ||
|
|
||
| </eslint-code-block> | ||
|
|
||
| ## :wrench: Options | ||
|
|
||
| Nothing. | ||
|
|
||
| ## :mag: Implementation | ||
|
|
||
| - [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/valid-define-emits.js) | ||
| - [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/valid-define-emits.js) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,144 @@ | ||
| /** | ||
| * @author Yosuke Ota <https://github.com/ota-meshi> | ||
| * See LICENSE file in root directory for full license. | ||
| */ | ||
| 'use strict' | ||
|
|
||
| const { findVariable } = require('eslint-utils') | ||
| const utils = require('../utils') | ||
|
|
||
| module.exports = { | ||
| meta: { | ||
| type: 'problem', | ||
| docs: { | ||
| description: 'enforce valid `defineEmits` compiler macro', | ||
| // TODO Switch in the major version. | ||
| // categories: ['vue3-essential'], | ||
| categories: undefined, | ||
| url: 'https://eslint.vuejs.org/rules/valid-define-emits.html' | ||
| }, | ||
| fixable: null, | ||
| schema: [], | ||
| messages: { | ||
| hasTypeAndArg: '`defineEmits` has both a type-only emit and an argument.', | ||
| referencingLocally: | ||
| '`defineEmits` are referencing locally declared variables.', | ||
| multiple: '`defineEmits` has been called multiple times.', | ||
| notDefined: 'Custom events are not defined.', | ||
| definedInBoth: | ||
| 'Custom events are defined in both `defineEmits` and `export default {}`.' | ||
| } | ||
| }, | ||
| /** @param {RuleContext} context */ | ||
| create(context) { | ||
| const scriptSetup = utils.getScriptSetupElement(context) | ||
| if (!scriptSetup) { | ||
| return {} | ||
| } | ||
|
|
||
| /** @type {Set<Expression | SpreadElement>} */ | ||
| const emitsDefExpressions = new Set() | ||
| let hasDefaultExport = false | ||
| /** @type {CallExpression[]} */ | ||
| const defineEmitsNodes = [] | ||
| /** @type {CallExpression | null} */ | ||
| let emptyDefineEmits = null | ||
|
|
||
| return utils.compositingVisitors( | ||
| utils.defineScriptSetupVisitor(context, { | ||
| onDefineEmitsEnter(node) { | ||
| defineEmitsNodes.push(node) | ||
|
|
||
| if (node.arguments.length >= 1) { | ||
| if (node.typeParameters && node.typeParameters.params.length >= 1) { | ||
| // `defineEmits` has both a literal type and an argument. | ||
| context.report({ | ||
| node, | ||
| messageId: 'hasTypeAndArg' | ||
| }) | ||
| return | ||
| } | ||
|
|
||
| emitsDefExpressions.add(node.arguments[0]) | ||
| } else { | ||
| if ( | ||
| !node.typeParameters || | ||
| node.typeParameters.params.length === 0 | ||
| ) { | ||
| emptyDefineEmits = node | ||
| } | ||
| } | ||
| }, | ||
| Identifier(node) { | ||
| for (const def of emitsDefExpressions) { | ||
| if (utils.inRange(def.range, node)) { | ||
| const variable = findVariable(context.getScope(), node) | ||
| if ( | ||
| variable && | ||
| variable.references.some((ref) => ref.identifier === node) | ||
| ) { | ||
| if ( | ||
| variable.defs.length && | ||
| variable.defs.every((def) => | ||
| utils.inRange(scriptSetup.range, def.name) | ||
| ) | ||
| ) { | ||
| //`defineEmits` are referencing locally declared variables. | ||
| context.report({ | ||
| node, | ||
| messageId: 'referencingLocally' | ||
| }) | ||
| } | ||
| } | ||
| } | ||
| } | ||
| } | ||
| }), | ||
| utils.defineVueVisitor(context, { | ||
| onVueObjectEnter(node, { type }) { | ||
| if (type !== 'export' || utils.inRange(scriptSetup.range, node)) { | ||
| return | ||
| } | ||
|
|
||
| hasDefaultExport = Boolean(utils.findProperty(node, 'emits')) | ||
| } | ||
| }), | ||
| { | ||
| 'Program:exit'() { | ||
| if (!defineEmitsNodes.length) { | ||
| return | ||
| } | ||
| if (defineEmitsNodes.length > 1) { | ||
| // `defineEmits` has been called multiple times. | ||
| for (const node of defineEmitsNodes) { | ||
| context.report({ | ||
| node, | ||
| messageId: 'multiple' | ||
| }) | ||
| } | ||
| return | ||
| } | ||
| if (emptyDefineEmits) { | ||
| if (!hasDefaultExport) { | ||
| // Custom events are not defined. | ||
| context.report({ | ||
| node: emptyDefineEmits, | ||
| messageId: 'notDefined' | ||
| }) | ||
| } | ||
| } else { | ||
| if (hasDefaultExport) { | ||
| // Custom events are defined in both `defineEmits` and `export default {}`. | ||
| for (const node of defineEmitsNodes) { | ||
| context.report({ | ||
| node, | ||
| messageId: 'definedInBoth' | ||
| }) | ||
| } | ||
| } | ||
| } | ||
| } | ||
| } | ||
| ) | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.