vue 组件注册问题

为神马，这里要用这样的方式才能调用组件？下面components里面是不是注册？
<Comp-A></Comp-A><comp-b></comp-b>

<topNav></topNav>这句为神马又没有效果？

<template>
  <topNav></topNav>
  <Comp-A></Comp-A>
  <comp-b></comp-b>
  <counter></counter>
</template>

<script>
import CompA from './components/a.vue'
import CompB from './components/b.vue'
import Counter from './components/counter.vue'
import topNav from './components/topNav.vue'

export default {
  data () {
    return {
      msg: 'Hello from vue-loader!'
    }
  },
  components: {
    CompA,
    CompB,
    Counter,
    topNav
  }
}
</script>

---

由于 html 不区分大小写，因此对于标签名、属性名等 vue 会自动进行驼峰形式和横线形式的转换。
具体见：http://cn.vuejs.org/guide/components.html#camelCase_vs-_kebab-case