微信公众号：大前端学习之旅
关注可了解更多的前端学习教程，一起学习成长。
如果你觉得对你有帮助，欢迎点赞[1]
一个DOM元素同时拥有多个类名时的样式
1<div class="m1 m2">测试</div>
2<div class="m2 m1">测试样式</div>
样式代码：
1.m1{color:white;border: 1px solid red; margin-top: 20px;}
2.m2{background-color: blue;border: 10px solid rgb(102, 238, 38);}
请问效果最终是怎样的？
如何利用webpack来优化前端性能
1.使用css-loader减小css体积
2.清除没必要的插件，减小打包体积
3.利用CDN加速：什么是CDN加速https://blog.csdn.net/SUNbrightness/article/details/89387311
将引用的静态资源修改为CDN上对应的路径，可以利用webpack对于output参数和loader的publicpath参数来修改资源路径
4.使用优化图片image-webpack-loader优化图片
在webpck.base.conf.js中url-loader设置limit,对小于limit会转化为base64,所以对较大的图片资源会通过images-webpack-loader来压缩大的图片
5.提取公共代码
webpack4移除了CommonsChunkPlugin (提取公共代码)，用optimization.splitChunks和optimization.runtimeChunk来代替
vue3.0和vue2.x的区别
vue3.0基于ts重构。
1.默认项目目录结构也发生了变化：
- 移除了配置文件目录，config 和 build 文件夹，但是多了.env.production和env.development文件，除了文件位置，实际配置起来和2.0没什么不同，没了config文件，跨域需要配置域名时，从config/index.js 挪到了vue.config.js中，配置方法不变
- 移除了 static 文件夹，新增 public 文件夹，并且 index.html 移动到 public 中
- 在 src 文件夹中新增了 views 文件夹，用于分类 视图组件 和 公共组件
2.部分命令发生了变化：
下载安装 npm install -g vue@cli
删除了vue list
创建项目 vue create
启动项目 npm run serve
3.数据监听的改变
- vuex2.x使用的es5的object.defineproperties中的getter和setter实现。而vue3.0是基于es6提供的proxy进行监听的,即按需监听。速度加倍，同时内存占用减半。
- 相比于旧的defineProperty API ,Proxy可以代理数组和对象。
4.按需引入
Vue2.x中new出的实例对象，所有的东西都在这个vue对象上，这样其实无论你用到还是没用到，都会跑一变。而vue3.0中可以用ES module imports按需引入，如：keep-alive内置组件、v-model指令，等等。
5.使 Vue 更小
runtime-core 体积压缩成了 约10kb
学习列表
√面试题复习，已完成;
xwebpack复习，未完成;
