# vue/valid-define-emits

enforce valid defineEmits compiler macro

  • ⚙️ This rule is included in all of "plugin:vue/vue3-essential", "plugin:vue/essential", "plugin:vue/vue3-strongly-recommended", "plugin:vue/strongly-recommended", "plugin:vue/vue3-recommended" and "plugin:vue/recommended".

This rule checks whether defineEmits compiler macro is valid.

# 📖 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 {}.
<script setup> /* ✓ GOOD */ defineEmits({ notify: null }) </script>
Now loading...
<script setup> /* ✓ GOOD */ defineEmits(['notify']) </script>
Now loading...
<script setup lang="ts"> /* ✓ GOOD */ defineEmits<(e: 'notify') => void>() </script>
Now loading...
<script> const def = { notify: null } </script> <script setup> /* ✓ GOOD */ defineEmits(def) </script>
Now loading...
<script setup> /* ✗ BAD */ const def = { notify: null } defineEmits(def) </script>
Now loading...
<script setup lang="ts"> /* ✗ BAD */ defineEmits<(e: 'notify') => void>({ submit: null }) </script>
Now loading...
<script setup> /* ✗ BAD */ defineEmits({ notify: null }) defineEmits({ submit: null }) </script>
Now loading...
<script> export default { emits: { notify: null } } </script> <script setup> /* ✗ BAD */ defineEmits({ submit: null }) </script>
Now loading...
<script setup> /* ✗ BAD */ defineEmits() </script>
Now loading...

# 🔧 Options

Nothing.

# 🚀 Version

This rule was introduced in eslint-plugin-vue v7.13.0

# 🔍 Implementation