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