Webpack srcset加载程序创建损坏的文件（网页包）

我试图使用

srcset loader

为项目创建srcset和不同大小的图像。srcset加载程序工作正常，并输出以下内容：

{
    "sources": {
        "100w": "/public/build/images/2322f015aeeee277d059fe0263f57559.png",
        "200w": "/public/build/images/bd13c599640b8bf64e9b9fd0a75aa6ef.png"
    },
    "srcSet": "/public/build/images/2322f015aeeee277d059fe0263f57559.png 100w,/public/build/images/bd13c599640b8bf64e9b9fd0a75aa6ef.png 200w"
}

我的本地服务器运行在

localhost:3003

上，因此当我尝试访问

localhost:3003/public/build/images/2322f015aeeee277d059fe0263f57559.png

它显示的图像如下所示：

我的网页包配置如下以加载图像：

{
  test: /\.(jpe?g|png|gif|svg|webp)$/i,
  // match one of the loader's main parameters (sizes and placeholder)
  resourceQuery: /[?&](sizes|placeholder)(=|&|\[|$)/,
  use: [
    "srcset-loader",
    "file-loader?outputPath=images/&name=[hash].[ext]"
  ]
},
{
  test: /\.(jpe?g|png|gif|svg|webp)$/i,
  // match one of the loader's main parameters (sizes and placeholder)
  use: [
    "file-loader?outputPath=images/&name=[hash].[ext]"
  ]
}

因此，当通过url访问时，基本上提供文本/字符串：

module.exports=uu网页包_u公共路径_uu+“images/654e6b8201639fdb1e9c2508b226a960.png”

感谢您的帮助。提前谢谢