,{
  test:/\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
  use: [{
    loader:'file-loader',
    options: {
      name:'[name].[ext]',
      outputPath:'fonts/'
    }
  }]
}

If webpack finds any font files being referenced inside of any SCSS files, it will duplicate the font files, and place them into whatever directory we specify using outputPath. This is required for our fonts to be referenced correctly within our compiled version of our CSS located in /dist. In this instance, webpack and file-loader will duplicate all fonts to a folder called fonts/ within our dist/ directory since the output path of the fileLoader is relative to the path specified in the outputPath property of the overall webpack config.