webpack整理（四）

webpack中使用file-loader，url-loader
安装：
npm i file-loader url-loader -D
先在项目中引入图片，结构如下

在css中引入图片，这个时候就需要配置url-loader或者file-loader来处理图片

在webpack.config.js中配置file-loader和url-loader，可以发现两者基本类似，url-loader包含了一个limit属性，如果小于设置的大小，图片就会以base64的编译方式进行编译，减少页面向服务器发送请求的次数，所以一般可以直接用url-loader
*注意：*如果用了url-loader，一定要同时下载file-loader，因为url-loader中会用到file-laoder，所以如果使用url-loader,一定要下载file-loader

url-loader不仅可以处理图片文件，包括处理平时用的字体文件，例如：
先创建引入字体文件

如果没有字体文件，可以去https://pan.lanzou.com/i0jon3e下载
然后在css中引入字体文件：

然后配置字体打包的文件：

运行webpack，就会生成对应的fonts文件