> For the complete documentation index, see [llms.txt](https://sugar-at.gitbook.io/blog-article/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://sugar-at.gitbook.io/blog-article/webpack/fonts.md).

# 7. 字体文件处理

## 1. 安装 file-loader

```
npm install file-loader --save-dev
```

## 2. 在webpack.config.js中配置

```javascript
module.exports={
    //...code
    module:{
        rules:[
           { //字体文件
                test: /\.(eot|svg|ttf|woff|woff2)$/,
                loader: 'file-loader',
                options: {
                    name: "[name].[ext]",
                    outputPath: './fonts'
                }
            }
        ]
    }
}
```

## 3. 使用方法

直接启动webpack进行项目打包即可