vue.js - Vue-cli Webpack 配置：如何正确设置 webp-loader

Question

根据 webp-loader文档，我正在尝试在我的

vue.config.js

const webpack = require('webpack')

module.exports = {
  configureWebpack: {
    loaders: [
      {
        test: /\.(jpe?g|png)$/i,
        loader: multi( 'file-loader?name=[name].[ext].webp!webp-loader?{quality: 95}', 'file-loader?name=[name].[ext]' )
        )
      }
    ]
  }
}

但这似乎是错误的......

error . = . ReferenceError: multi is not defined

webp-loader 文档有什么问题？

感谢您的反馈

Answer 1

直接来自 webp-loader 文档：

通常，您不想将所有图像转换为 WebP 格式，而只想制作替代版本。您可以使用multi-loader来实现它：

他们告诉你，你必须使用另一个装载机，多装载机，才能做到这一点。

所以文档暗示，但不直接显示，你实际上必须先导入这个加载器，像这样：

const multi = require('multi-loader')

（当然你跑了npm install -D multi-loader）在那之前）