官網的描述：
模板將會替換掛載的元素。掛載元素的內容都將被忽略 也就是說:template: ‘’ 表示用替換index.html裏面的
舉個例子：
main.js:
------------------
import App from '@/App'
new Vue({
el: '#app',
components:{App},
template: '<App/>'
})
App.vue
-------------------
<template>
<transition name="fade">
<router-view></router-view>
</transition>
</template>
<script>
export default {
}
</script>
index.html
--------------------
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>vuecli_01</title>
</head>
<body>
<div id="app">11</div>
<!-- built files will be auto injected -->
</body>
</html>
在main.js中，vue實例的components 是聲明有哪些組件，我們通過import App from '@/App'導入，template 是使用哪個組件，el: '#app' 是index.html 的<div id="app"></div>,它將被替換爲mian.js中導入的組件App.vue，組件一般使用的方法就是<App></App>,
- 需要注意的是，在components:{App}中採用了縮寫，本來應該是components:{App：App},組件名和模板名一樣，就縮寫了
其實一個組件就等於是自定義標籤一樣。都是tag