Vue项目中main.js app.vue index.html之间关系

1 main.js作为入口文件

读取main.js中Vue实例

new Vue({

el:'#app',//代表index.html中要挂载的地点，index.html 中<div id="#app"></div> 两个地方的ID保持一致，才可以挂载成功

component：{App}, //需要在main.js中导入

template："<App/>",//讲component中的{App}组件在index.html中渲染dom

store，//状态管理Vuex

router//路由

})

2 App.vue

一个渲染的模板

<router-view></router-view>//动态路由匹配，根据路由加载相应的 vue组件

3 index.html

<div id="app"></div>

在webpack中build配置，最后打包渲染生成的最终页面