vue项目-页面加载过程

1.当一个vue项目启动时，页面加载过程为

index.html --> main.js -->APP.vue -->index.js -->HelloWorld.vue

2.每个组件的详细解释

• index.html

  项目的运行入口，在body体中只有一个 div 标签，其 id 为 app，这个 id 将会连接到 src/main.js 内容。
  在浏览器打开的瞬间，浏览器中正文部分会瞬间显示index.html 中定义的正文部分。上面有一个 id 为 app 的挂载点，之后我们的 Vue 根实例就会挂载到该挂载点上

• main.js

  入口文件，主要作用是初始化vue实例，并引入所需要的插件。新建了一个 vue 实例，并使用 el：#app 链接到 index.html 中的 app，并使用 template 引入组件和路由相关的内容，也就是说通过 main.js 我们关联到 App.vue 组件

• App.vue

  主组件，所有页面都是在 App.vue 下进行切换的。可以理解为所有的路由 router，也是 App.vue 的子组件。

• Index.js

  标签下，有标签，标签将会把路由相关内容渲染在这个地方，路由中文件位于src/router/index.js 中。在 index.js 的代码中，建立了路由相关的内容，也就会渲染到 app.vue 下面的中。

3.        vue-cli 3.x 的 views 和 components有什么区别？
components是小组件
containers是容器级组件
views是页面级组件

也就是说，views是页面级组件，components是小组件

小组件可被引用在views中，一般views组件不被复用

【containers是容器级组件（根据项目大小决定是否使用）】

从组件大小级别区分 components < （containers）<  views