【vue】index.html main.js app.vue

第一步、index.html

vue是单页界面，主窗口通过index.html渲染，默认的http://localhost:8080会去加载index.html，当执行npm run dev后，main.js会被添加到index.html中

第二步、main.js

main.js是我们的入口文件，主要作用是初始化vue实例，并引入所需要的插件，会用App.vue替换index.html中的id='app'的div

第三步、App.vue

App.vue是我们的主组件，所有页面都是在App.vue下进行切换的。其实你也可以理解为所有的路由也是App.vue的子组件。所以我将router标示为App.vue的子组件；App.vue中添加<router-view/>，用来承载路由组件

第四步、index.js

vue路由会去监听url变化，通过路由配合找到相应组件，加载到<router-view/>上，实现页面切换

注：本文系本人对vue初学的理解，可能会存在误解