Please describe what the rule should do:

Enforce (or warn) when a required prop is not given to a Vue component.

What category should the rule belong to?

[ ] Enforces code style (layout)
[X] Warns about a potential error (problem)
[ ] Suggests an alternate way of doing something (suggestion)
[ ] Other (please specify:)

Provide 2-3 code examples that this rule should warn about:

// CurrentMood.vue <script> export default {  name: "CurrentMood",  props: {  emotion: {  type: String,  required: true,  },  }, } </script> // GOOD example <CurrentMood emotion="happy" /> // BAD example - missing required prop <CurrentMood />

Additional context

Am I missing something obvious or is there no way to detect a case when you fail to give a required prop? PyCharm's Vue plugin is able to detect this via the HTML inspection "missing required attribute".

It would be great if eslint could detect this too. I did a ticket search and couldn't find any similar requests. Please forgive me if this has already been discussed and rejected.

On a related note, I'm also looking for a way to require in eslint that a certain list of HTML elements has certain required attributes within a Vue file. E.g. require "id" attributes on <button>, <input>, etc., as well as on certain Vue components.