懒惰的单页问题单页问题，首页画面读取非常慢
带上脚手架打包工具，webpack将所有组件打包到app.js文件中，并在第一个屏幕上一次全部下载
解决方案1 .异步延迟加载2 .完全懒惰加载
1 .异步延迟加载定义：优先下载并查看首页内容。
其他页面组件采用基本的异步下载方法。 异步下载而不影响主屏幕的下载速度。
优点是第一个屏幕的读取速度更快，可以享受单页APP应用的好处。
在步骤router/index.js的开头，请勿太早部署非首页页面组件。 (在import中引入的内容，vue认为是优先事项，打包在app.js中，在首页画面中加载。)
.改造路由词典
{ path: '/相对路径'，name: '名称'，component: ()=import (/* webpackchunkname : (名称(*/)根路径) )
script src='.' preload/script
script src='.' prefetch/script
web包包都是自动配置的。
preload 即提前下载，又要立刻显示---通常用于首页
prefetch 仅异步延迟下载，但不着急显示---除首页外，其余页面组件均采用
2 .彻底懒加载定义用户不看哪些页面，不下载，在用户看之前暂时不下载
在步骤router/index.js的开头，请勿太早部署非首页页面组件。 (在import中引入的内容，vue认为是优先事项，打包在app.js中，在首页画面中加载。)
.改造路由词典
{ path: '/相对路径'，name: '名称'，component: ()=import (/* webpackchunkname : (名称(*/)根路径) )
)1)在脚手架路线下，创建vue.config.js
)2)在vue.config.js中添加固定代码
module.exports={ chain web pack : config={ config.plugins.delete (prefetch )； 用于删除具有由index.html开发的prefetch属性的link。 请不要异步下载。 暂时不需要页面组件文件。
避免组件之间的样式冲突如果不同组件中的选择器碰巧相同，则它们一定会相互影响
解决方案：
style scoped/style //仅内部选择器有效，不适用于外部部署
scoped :具有随机名称的属性选择器将自动添加到CSS属性选择器中
主动将class名称添加到组件的唯一父元素中