vue项目分析--index.html+main.js+App.vue关系,前端路由的使用

main.js引入文件
https://www.cnblogs.com/chenleideblog/p/10484554.html
https://blog.csdn.net/bujiongdan/article/details/81416100

app.vue是一个根组件，main.js 是一个入口文件，index.html是项目入口
index.html有的时候放在public文件夹下

app.vue里实际上就是定义了一个可以操作的vue模板区域，export default实际上就是把这个根组件暴露出去的意思，也可以在里面定义一下组件的名字

main.js里从app.vue里引入app，从vue的js文件里引入vue，之后写new vue，el里是要操作的组件的id，组件里写App，就是app.vue这个根组件的意思

实际上，浏览器访问的第一个文件是index.html，里面有一个id为app的挂载点，之后vue的根实例挂载在上面

main.js里新建一个vue实例，里面使用el声明要挂载的对象的id
实例components: {App }注册了一个局部的组件–App，局部组件实际上是来自于app.vue，template: ''表示起模板是组件app.vue里的template里的内容

所以main.js这个文件就是先把App.vue引入为App对象，之后新建一个vue实例把App.vue作为一个组件注入到index.html里的id为app的元素里，使用app里的模板也就是template里的内容取代元素内容

所以实际上项目运行的时候，main.js是项目的入口文件，运行时通过它找到实例需要挂载的位置，一开始是显示挂载点的内容，之后立刻使用实例注入的组件里的模板的内容取代

main.js里一般会把路由传进去

new Vue({
   
    el: '#app',
    router,
    store,
    render: h => h(App)
})

import Vue from 'vue'
import router from './router'
import store from './store'

new Vue({
   
  router,
  store,
  render: h