Webpack 网页包监视和字体设置：缺少webfont文件_Webpack_Font Awesome 5

Webpack 网页包监视和字体设置：缺少webfont文件

webpack

Webpack 网页包监视和字体设置：缺少webfont文件,webpack,font-awesome-5,Webpack,Font Awesome 5,我正在使用Webpack4.x和FontAwesome5Pro以及CleanWebpackPlugin在每次构建时清理dist目录。我面临的问题是，webfonts文件（如*woff等）在首次运行Webpack后丢失。下面是它的样子：在开发模式下启动网页时启用监视所有css、js和字体文件都以散列名称放置在dist中，我还可以在那里看到*woff文件我对任何被监视的js或css文件进行任何更改，以触发webpack监视 clean webpack plugin启动并清理dist目录

我正在使用Webpack4.x和FontAwesome5Pro以及

CleanWebpackPlugin

在每次构建时清理dist目录。我面临的问题是，webfonts文件（如*woff等）在首次运行Webpack后丢失。下面是它的样子：

在开发模式下启动网页时启用
```
监视
```
所有css、js和字体文件都以散列名称放置在
```
dist
```
中，我还可以在那里看到*woff文件
我对任何被监视的js或css文件进行任何更改，以触发webpack监视
```
clean webpack plugin
```
启动并清理
```
dist
```
目录
Webpack再次构建所有内容，将所有我的js/css和字体很棒的css js文件放入
```
dist
```
，但不放入字体文件，因此所有
```
*woff
```
文件都完全丢失

我的字体是这样的

import'@fortawesome/fontawesome-pro/css/all.css'
all.css
引用了所有webfont文件，那么为什么Webpack不将它们包含在构建中呢？
我也遇到了同样的问题（除了使用字体awsome），并且能够通过使用url加载器而不是文件加载器来解决这个问题，如果您可以选择的话。最终的结果是，它将通过css中的数据uri内联字体，而不是在dist文件夹中创建字体文件。这里很好地解释了这样做的含义：
我的相关网页包配置：
rules: [
  // other rules...

  // font rule
  {
    test: /\.(woff|woff2|eot|ttf|otf)$/,
    loader: 'url-loader?limit=100000',
  }
]