1

这是我的配置

{
plugins: [
    new ImageMinimizerPlugin({
      minimizerOptions: {
        plugins: ['pngquant'],
      },
    }),
    new ImageMinimizerPlugin({
      deleteOriginalAssets: false,
      filename: '[path][name].webp',
      minimizerOptions: {
        plugins: ['imagemin-webp'],
      },
    })
]
}
// ...
appConfig.output.assetModuleFilename = '[path][name][ext]'

现在我想添加规则

{
    test: /\.(jpe?g|png|svg|gif|webp)$/i,
    type: 'asset/resource',
    generator: {
      filename: (source) => {
        return source.filename.replace('assets/', '')
      },
    },
  }

清单.json


  "build/app.webp": "/build/assets/images/image-error.webp",
  "build/app.jpg": "/build/images/image-error.jpg",

如何配置 webpack 以使 webp 图像最终位于原始图像旁边？此规则仅适用于原始图像，但 webp 图像将保留 'assets/' 前缀。

当然我可以删除文件名功能，但我不希望它们最终出现在资产中。由于遗留代码，我需要他们结束一个文件夹。

4

0 回答 0