Description
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-componentin the template andmyCoolComponentin the registered components listmy-cool-componentin the template andMyCoolComponentin the registered components list
but these cause Vue runtime errors
MyCoolComponentin the template andmyCoolComponentin the registered components listmyCoolComponentin the template andMyCoolComponentin 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-componentsto 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?