update `no-unused-components` to not mix pascal/camel casing

[evykassirer]

What rule do you want to change?

no-unused-components

Does this change cause the rule to produce more or fewer warnings?

more (but for things that cause runtime errors)

How will the change be implemented? (New option, new default behavior, etc.)?

Update the lines around here https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-unused-components.js#L108 to not mix pascal and camel case, or possibly something a bit more complicated (see the notes on on word components below)

Please provide some example code that this change will affect:

<template>
    <MyCoolComponent />
</template>

<script>
import Vue from "vue";

import myCoolComponent from "path/to/my-cool-component.vue";

export default Vue.extend({
    name: "ParentComponent",

    components: {
        myCoolComponent,
    },

    ...

<template>
    <myCoolComponent />
</template>

<script>
import Vue from "vue";

import MyCoolComponent from "path/to/my-cool-component.vue";

export default Vue.extend({
    name: "ParentComponent",

    components: {
        MyCoolComponent,
    },

    ...

What does the rule currently do for this code?

it doesn't fail on this code, but this code causes Vue runtime errors (the component doesn't load and there's an unregistered component error)

What will the rule do after it's changed?

it will label the component as not registered

Additional context

note that these work fine

• my-cool-component in the template and myCoolComponent in the registered components list
• my-cool-component in the template and MyCoolComponent in the registered components list

but these cause Vue runtime errors

• MyCoolComponent in the template and myCoolComponent in the registered components list
• myCoolComponent in the template and MyCoolComponent in the registered components list

also I haven't figured out why, but it seems like one word components, e.g.Foo in the template and foo in the registered components list

• do not cause Vue runtime errors like multi-word components do
• do cause no-unused-components to error

(note that foo in the template and Foo in the registered components list works the same as kebab case in the template, since foo is also kebab case)

curious if I'm missing some context on how Vue works? or does the linting rule need to be updated?

[ota-meshi]

Thank you for this issue! It would be great if we could catch the cause of the runtime error in advance.