# vue/one-component-per-file

enforce that each component should be in its own file

⚙️ This rule is included in all of "plugin:vue/vue3-strongly-recommended", "plugin:vue/strongly-recommended", "plugin:vue/vue3-recommended" and "plugin:vue/recommended".

# 📖 Rule Details

This rule checks if there is only one component per file.

/* ✗ BAD */

Vue.component('TodoList', {
  // ...
})

Vue.component('TodoItem', {
  // ...
})

Now loading...

<script>
/* ✓ GOOD */
export default {
  name: 'my-component'
}
</script>

Now loading...

Nothing.

This rule was introduced in eslint-plugin-vue v7.0.0