Local components declared in a Vue component should be used
- VUE_UNUSED_LOCAL_COMPONENT
- Code Quality
- Low
- vue
This rule applies when local components declared in a Vue component are not used.
For maintainability, it is recommended to remove unused local components. Also, it might be a mistake that a programmer forgets to use the declared local components.
Noncompliant Code Example
View with compliant examples side by side<template>
<div>
<div>name: {{ person.name }}</div>
<div>age: {{ person.age }}</div>
<Address :info="person.address" />
<!-- <EmailAddress :info="person.contact.emailAddress" /> -->
<Contact :info="person.contact" />
</div>
</template>
<script>
import Address from "./Address";
import EmailAddress from "./EmailAddress";
import Contact from "./Contact";
export default {
props: ["person"],
components: {
Address,
EmailAddress, // VUE_UNUSED_LOCAL_COMPONENT alarm
Contact
}
}
</script>
Compliant Code Example
View with noncompliant examples side by side<template>
<div>
<div>name: {{ person.name }}</div>
<div>age: {{ person.age }}</div>
<Address :info="person.address" />
<Contact :info="person.contact" />
</div>
</template>
<script>
import Address from "./Address";
import Contact from "./Contact";
export default {
props: ["person"],
components: {
Address,
Contact
}
}
</script>
Version
This rule was introduced in DeepScan 1.18.0.