关于vuejs的入口问题 - template: '<App/>'

1. 主要文件

project目录下index.html文件

project/src目录下的main.js

project/src目录下的app.vue

2. 关系

index.html文件下

<body>
<div id="{字段1}" class="test">{index文件中div块中的内容.msg}</div>
<!-- {<script>} -->
</body>

main.js文件下

new Vue({
  el: '#字段2',
  router,
  components: { App },
  template: '<App/>'
})

1. 程序发布时，无论字段1和字段2是否匹配，都将在index.html中添加一条script引入app.js的代码（这应该是由配置文件控制的）

2. 当字段1和字段2相匹配时，引入的js才会起作用，否则无效果。（即：生成js文件，并通过el字段绑定到index.html中的相应dom）

3. 当js文件起效果时，将会用app.vue中的模板内容替换掉div="app"中的内容（其实应该说：1.渲染<div id="app">元素，2.移除该dom元素并渲染出app.vue中的模板，样式什么的，也是用app.vue里面的）

PS：浏览器速度够慢的话，是可以看到<div id="app">里面的内容一闪而过的。

<body>
    <div id="app" class="这个class样式也是一闪而过">一闪而过</div>如果这里还有内容，它是会显示的，而且不会被替换掉。
  　<script type="text/javascript" src="/app.js"></script>
</body>

以上：经过确切测试，大致表象是这样，只学了几天vue的我，并不懂其内涵。

以下：猜测，指不定是错的，看官看看就好~欢迎批评留言

import App from './App'  相当于 Vue.component('App',App.vue）， 
其实就是引入组件对象（非实例，组件对象是给Vue实例调用的）,并命名为App

components:{App},　　Vue实例使用components字段声明其具有的子组件App，在绑定了Vue实例的dom元素上，可通过<App/><App>调用该子组件
template: '<App/>'
#Vue实例使用template字段声明了一个模板，其模板即为<App/><App>（我猜：该字段是用于生成的js文件的，js文件实质上是用该模板替换了index.html下的<div id="App">）