Back
VueEasyNew

What naming conventions are recommended for Vue components?

PascalCase, multi-word names

Ideal Answer

Recommended conventions from the Vue style guide:

  • PascalCase filenames and component names (e.g., UserProfile.vue), which also makes them easy to distinguish in templates and IDE auto-imports.
  • Multi-word names (e.g., BaseButton.vue instead of Button.vue) to avoid clashing with current or future native HTML elements.
  • Meaningful, specific names (SubmitButton.vue) rather than vague ones (Button.vue, Item.vue).
  • Prefix tightly related component families consistently (e.g., SearchInput, SearchButton for a search feature, or Base/App-prefixed names for global base components).