JS.VUE.ONE.COMPONENT.PER.FILE

Enforce that each component should be in its own file

Rule Details

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

{'vue/one-component-per-file': ['error']}

Copy
/* BAD */

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

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

{'vue/one-component-per-file': ['error']}

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

Options

Nothing.

Further Reading

  • Style guide - Component files (https://vuejs.org/style-guide/rules-strongly-recommended.html#component-files)

The content on this page is adapted from the ESLint User Guide. Copyright © OpenJS Foundation and other contributors, www.openjsf.org. All rights reserved. https://eslint.org/docs/rules/