Javascript 网页包字体：字体错误路径

当我运行

npm运行production

时，它会构建我的JS和CSS（来自SASS）并将其放在我的drupal主题目录中。我的

fontawesome.css

中的字体路径不正确

路径应该是

。/font/vendors/@fortawesome/fontawesome-pro-webfa-brands-400.woff？5DD043615247F4082A329CCCCCACACA7B

或

/themes//font/vendor/@fortawesome/fontawesome-pro-webfa-brands-400.woff？5dd043615247f4082a329ccccccaacca7b

但它们的生成方式类似于

/fonts/vendor/@fortwome/fontwome-pro-webfa-brands-400.woff？5dd043615247f4082a329cccaca7b

我已经尝试添加一个webpack.config.js文件来让它工作，但是我在这方面运气不好，我真的不确定我在做什么。我从来没有真正做到这一点，但我已经把我的代码包括在下面

const path = require('path');

const config = {
  src: './web/themes/<theme-name>/src/',
  dist: './web/themes/<theme-name>/'
};

module.exports = {
  entry: {
    main: config.src + 'js/app.js' ,
    sass: config.src + 'sass/app.scss'
  },
  output: {
    path: path.resolve(__dirname, config.dist)
  },
  module: {
    rules: [
      {
        test: /\.(eot|woff|woff2|ttf|svg)(\?\S*)?$/,
        use: [{
          loader: 'file-loader',
          options: {
            name: '[name].[ext]',
            outputPath: config.dist + 'fonts/',
            publicPath: '/themes/<theme-name>/fonts/'
          }
        }]
      }
    ]
  }
};

const path=require（'path'）；
常量配置={
src:'./web/themes//src/'，
地区：'./web/themes/'
};
module.exports={
条目：{
main:config.src+'js/app.js'，
sass:config.src+'sass/app.scss'
},
输出：{
path:path.resolve（\uu dirname，config.dist）
},
模块：{
规则：[
{
测试：/\（eot | woff | woff2 | ttf | svg）（\？\S*）？$/，
使用：[{
加载器：“文件加载器”，
选项：{
名称：'[name].[ext]'，
outputPath:config.dist+'fonts/'，
publicPath:'/themes//font/'
}
}]
}
]
}
};

在此方面的任何帮助都将不胜感激