说明

组件名为多个单词

组件名应该始终是多个单词的，根组件 App 以及 <transition>、<component> 之类的 Vue 内置组件除外。

这样做可以避免跟现有的以及未来的 HTML 元素相冲突，因为所有的 HTML 元素名称都是单个单词的。

示例

components/
|- BigDog.vue

// BigDog.vue
export default {
  name: 'BigDog',
  // ...
}

import BigDog from 'BigDog.vue'

export default {
  components: {
    BigDog
  }
}

对应使用的时候，就应该是由用-符隔开的小写字母构成，如：

<big-dog></big-dog>

声明通用组件的时候应该增加前缀，避免重名冲突，可以为所属工程或组件库简称，如：

// BigDog.vue
export default {
  name: 'PaiBigDog',
  // ...
}

import BigDog from 'BigDog.vue'

Vue.component('pai-big-dog', BigDog)

对应使用的时候，就应该是由用-符隔开的小写字母构成，如：

<pai-big-dog></pai-big-dog>