html-webpack-pluin插件
作用：
自动根据我们写的html模板，生成并打包进入到dist文件中,并且能够自动引入打包后的 j s文件css的处理
默认情况下webpack只能处理 j s文件，因此如果需要处理 css 文件的时候需要用到加载器。
这个加载器相当于游戏中的装备，我们购买了它，我们就能获取到相应的技能
**css的加载器
我们需要有两个加载器来处理css文件
css-loader:让webpack能处理css类型文件
style-loader:把css插入到DOM中，从而让样式生效
主义：配置加载器的时候，两个加载器的顺序一定不能改变
要先写style-loader再写css-loader
原因是我们只能先让webpack处理好了css文件，然后才能把样式插入到DOM.
为什么要先写style-loader-----因为代码的是从右到左执行的。
less的处理器
1、下载加载器
npm i less less -loader -D
2、添加配置
{//处理less文件
test:/.less$/,
use:['style-loader','css-loader','less-loader']
}
3、src/less/index.less文件
然后设置标签样式
4、将这个less文件引入到main.js中
5、打包，在浏览器中看效果，样式是否改变
图片的处理
利用webpack5提供的asset module技术实现处理
设置type为asset值即可处理图片
语法降级处理
**用到babel插件**
1、下载
npm install babel-loader @babel/core @babel/preset-env -D
2、根据文档添加配置即可
3、测试 ---- 比如写一个箭头函数，看打包后能否转为普通函数
开发服务器的使用
开发服务器，把代码打包运行在内存中，自动更新，实时返回给浏览器显示
注意：通过开发服务器打包的项目是在内存中的，也就是说我们是看不到的，
必须通过服务器给我们的服务器地址才能正确访问到打包在内存中的项目
