Build: Replace the file-loader loader with asset module in webpack config (#53088)

scripts/webpack/plugins/CopyUniconsPlugin.js

@@ -1,39 +0,0 @@
-const fs = require('fs-extra');
-const path = require('path');
-
-class CopyUniconsPlugin {
-  /**
-   * @param {import('webpack').Compiler} compiler
-   */
-  apply(compiler) {
-    compiler.hooks.afterEnvironment.tap(
-      'CopyUniconsPlugin',
-      /**
-       * @param {import('webpack').Compilation} compilation
-       */
-      () => {
-        let destDir = path.resolve(__dirname, '../../../public/img/icons/unicons');
-
-        if (!fs.pathExistsSync(destDir)) {
-          let srcDir = path.join(
-            path.dirname(require.resolve('iconscout-unicons-tarball/package.json')),
-            'unicons/svg/line'
-          );
-          fs.copySync(srcDir, destDir);
-        }
-
-        let solidDestDir = path.resolve(__dirname, '../../../public/img/icons/solid');
-
-        if (!fs.pathExistsSync(solidDestDir)) {
-          let srcDir = path.join(
-            path.dirname(require.resolve('iconscout-unicons-tarball/package.json')),
-            'unicons/svg/solid'
-          );
-          fs.copySync(srcDir, solidDestDir);
-        }
-      }
-    );
-  }
-}
-
-module.exports = CopyUniconsPlugin;

scripts/webpack/webpack.common.js

@@ -2,7 +2,6 @@ const CopyWebpackPlugin = require('copy-webpack-plugin');
 const path = require('path');
 const webpack = require('webpack');
 
-const CopyUniconsPlugin = require('./plugins/CopyUniconsPlugin');
 const CorsWorkerPlugin = require('./plugins/CorsWorkerPlugin');
 
 module.exports = {
@@ -45,7 +44,6 @@ module.exports = {
     new webpack.ProvidePlugin({
       Buffer: ['buffer', 'Buffer'],
     }),
-    new CopyUniconsPlugin(),
     new CopyWebpackPlugin({
       patterns: [
         {
@@ -98,15 +96,15 @@ module.exports = {
         test: /\.css$/,
         use: ['style-loader', 'css-loader'],
       },
-      // for pre-caching SVGs as part of the JS bundles
-      {
-        test: /\.svg$/,
-        use: 'raw-loader',
-      },
       {
         test: /\.(svg|ico|jpg|jpeg|png|gif|eot|otf|webp|ttf|woff|woff2|cur|ani|pdf)(\?.*)?$/,
-        loader: 'file-loader',
-        options: { name: 'static/img/[name].[contenthash:8].[ext]' },
+        type: 'asset/resource',
+        generator: { filename: 'static/img/[name].[hash:8][ext]' },
+      },
+      // for pre-caching SVGs as part of the JS bundles
+      {
+        test: /(unicons|mono|custom)[\\/].*\.svg$/,
+        type: 'asset/source',
       },
     ],
   },