Webpack 5 - 资产模块 - 缺少 url-loader 功能 - postTransformPublicPath

Kry*_*Pix 6 assets module webpack

我想按照建议切换到 webpack 5 asset 模块。不幸的是我错过了 webpack url-loader 的函数“postTransformPublicPath: (path: any) => any”。

由于我们应用程序的结构,资产的公共区域和私人区域被划分在那里。通过 url 加载器,我可以使用以下内容:

      {
        test: /\.(png|jp(e*)g|gif|svg)$/,
        use: [{
          loader: 'url-loader',
          options: {
            limit: 10 * 1024, // Convert images < 10kb to base64 strings
            name: 'private/img/[name].[ext]',
            postTransformPublicPath: (path) => path.replace('private/', ''),
          },
        }],
      },
Run Code Online (Sandbox Code Playgroud)

结果,css中的url被设置为没有private的路径,而是放在文件夹结构中的private文件夹中。然后,该私有文件夹在身份验证后以静态方式提供。

是否有可能以某种方式将这种行为与资产模块一起使用?

      {
        test: /\.(png|jp(e*)g|gif|svg)$/,
        type: 'asset',
        generator: {
          filename: 'private/img/[base][query]',
        },
      },
Run Code Online (Sandbox Code Playgroud)