如何更改规则内的文件名？ (Vue CLI 5)

Question

我有这个规则，使用vue inspect

      /* config.module.rule('svg') */
          {
            test: /\.(svg)(\?.*)?$/,
            type: 'asset/resource',
            generator: {
              filename: 'img/[name][ext]'
            }
          },

我需要将文件名更改为“[contenthash][ext]” 但我不能使用

    module.exports = defineConfig({
    chainWebpack: (config) => {
    config.module.rule("svg").generator.filename = "[contenthash][ext]";
      },
    })

因为我无法设置发电机，

我可以使用

重写所有规则

    module.exports = defineConfig({
    configureWebpack: (config) => {
    config.module.rules = [
          {
            test: /\.(svg)(\?.*)?$/,
            use: [
              {
                loader: "svg-inline-loader",
                options: {
                  name: "[contenthash].[ext]",
                },
              },
            ],
          },
        ];
    },
  })

但我需要其他规则存在...那么我怎样才能更改 svg 的文件名？

Answer 1

试试这个：

chainWebpack: (config) => {
  config.module.rule("svg")
    .set('generator', {
      filename: "[contenthash][ext]"
    })
}

Source

如何更改规则内的文件名？ (Vue CLI 5)

How to change filename inside a rule? (Vue CLI 5)

webpack

vue.js

vue-cli

vue-cli-5