vue/require-explicit-slots
require slots to be explicitly defined
📖 Rule Details
This rule enforces all slots used in the template to be defined once either in the script setup block with the defineSlots macro, or with the slots property in the Options API.
<template>
<div>
<!-- ✓ GOOD -->
<slot />
<slot name="foo" />
<!-- ✗ BAD -->
<slot name="bar" />
</div>
</template>
<script setup lang="ts">
defineSlots<{
default(props: { msg: string }): any
foo(props: { msg: string }): any
}>()
</script>
<template>
<div>
<!-- ✓ GOOD -->
<slot />
<slot name="foo" />
<!-- ✗ BAD -->
<slot name="bar" />
</div>
</template>
<script lang="ts">
import { SlotsType } from 'vue'
defineComponent({
slots: Object as SlotsType<{
default: { msg: string }
foo: { msg: string }
}>
})
</script>
🔧 Options
Nothing.
🚀 Version
This rule was introduced in eslint-plugin-vue v9.21.0