## 图片处理
要让 webpack 处理 图片 文件，需要使用到加载器: url-loader
安装
```
yarn add url-loader --dev
```
在 `conf/webpack.config.js` 的 `module.rules` 中配置:
```js
{
test: /\.(png|svg|jpg|gif)$/,
use: [
'url-loader'
]
}
```
这样，就可以直接引入图片文件了
在 `src/main.js` 中直接引入图片即可
```js
import img from './img/img.png';
let myImg = new Image();
myImg.src = img;
console.log(myImg)
```
在 css 中引入相同
```
.box {
width: 200px;
height: 200px;
background: url(../img/img.png);
}
```
事实上，url-loader 可以接受任何类型的文件，将文件转化为 url 的形式，包括 字体、声音、视频、媒体文件 等。
