Appearance
require props to have a comment
This rule enforces that every prop has a comment that documents it.
<script> export default defineComponent({ props: { // ✓ GOOD /** JSDoc comment */ a: Number, // ✗ BAD // line comment b: Number, /* block comment */ c: Number, d: Number, } }) </script>
{ "vue/require-prop-comment": ["error", { "type": "JSDoc" }] }
type
"JSDoc"
"line"
"block"
"any"
"type": "block"
<script setup> // ✓ GOOD const goodProps = defineProps({ /* block comment */ a: Number, }) // ✗ BAD const badProps = defineProps({ /** JSDoc comment */ b: Number, // line comment c: Number, d: Number, }) </script>
"type": "line"
<script setup> // ✓ GOOD const goodProps = defineProps({ // line comment a: Number, }) // ✗ BAD const badProps = defineProps({ /** JSDoc comment */ b: Number, /* block comment */ c: Number, d: Number, }) </script>
"type": "any"
<script setup> // ✓ GOOD const goodProps = defineProps({ /** JSDoc comment */ a: Number, /* block comment */ b: Number, // line comment c: Number, }) // ✗ BAD const badProps = defineProps({ d: Number, }) </script>
This rule was introduced in eslint-plugin-vue v9.8.0
vue/require-prop-comment
📖 Rule Details
This rule enforces that every prop has a comment that documents it.
<script> export default defineComponent({ props: { // ✓ GOOD /** JSDoc comment */ a: Number, // ✗ BAD // line comment b: Number, /* block comment */ c: Number, d: Number, } }) </script>
🔧 Options
type
... Type of comment. Default is"JSDoc"
"JSDoc"
... Only JSDoc comment are allowed."line"
... Only line comment are allowed."block"
... Only block comment are allowed."any"
... All comment types are allowed."type": "block"
<script setup> // ✓ GOOD const goodProps = defineProps({ /* block comment */ a: Number, }) // ✗ BAD const badProps = defineProps({ /** JSDoc comment */ b: Number, // line comment c: Number, d: Number, }) </script>
"type": "line"
<script setup> // ✓ GOOD const goodProps = defineProps({ // line comment a: Number, }) // ✗ BAD const badProps = defineProps({ /** JSDoc comment */ b: Number, /* block comment */ c: Number, d: Number, }) </script>
"type": "any"
<script setup> // ✓ GOOD const goodProps = defineProps({ /** JSDoc comment */ a: Number, /* block comment */ b: Number, // line comment c: Number, }) // ✗ BAD const badProps = defineProps({ d: Number, }) </script>
🚀 Version
This rule was introduced in eslint-plugin-vue v9.8.0
🔍 Implementation