webpack处理less、图片和字体

1. 处理 less 文件

步骤：
1 安装包： npm i -D less-loader less
           npm i -D style-loader css-loader
2 在 webpack.config.js 的 module 中添加一个规则

2. 处理图片文件 url-loader 或者 file-loader

file-loader 对图片进行重命名，然后，加载图片

 1 安装： npm i -D file-loader
 2 在 webpack.config.js 中的 module 里面添加一个rules

自己写的路径为：../imgs/a.jpg

文件路径被重命名为： 1ddb3677198212f7fea7ca4b9de18dcb.jpg

原理：

MD5 加密算法（消息摘要算法） 通常就是 32 位

对于同一个文件或者字符，不管使用 md5 处理过多少次，那么，得到的 32位字符串都是相同的

在 file-loader 中，使用 md5 处理后，对于同一张不同名称的图片，只会加载一次，而如果不进行 md5 处理，就会加载两次，而这两张图片实际上就是同一张，实际上加载一次就可以了，这样的话，可以达到减少网络请求，加快网站的加载速度。

MD5 在项目中，一般可以用来进行密码加密处理

用户名 + 密码 ====> md5( 密码 ) ===> 1dd