webpack.config.min.js

const path = require('path');
const glob = require('glob');

const CopyPlugin                = require('copy-webpack-plugin');
const { CleanWebpackPlugin }    = require('clean-webpack-plugin');
const TerserPlugin              = require('terser-webpack-plugin');
const MiniCssExtractPlugin      = require('mini-css-extract-plugin');
const CssMinimizerPlugin        = require('css-minimizer-webpack-plugin');
const SpriteLoaderPlugin        = require( 'svg-sprite-loader/plugin' );
const RemoveEmptyScriptsPlugin  = require( 'webpack-remove-empty-scripts' );

// separate and compile every .scss & .js file from root 'src' folder
const parseEntries = (type, outputFolder, postfix = '') => {
  return glob.sync(`./src/${type}`).reduce((obj, el) => {
    const name = path.parse(el).name;

    obj[`${outputFolder}/${name}${postfix}`] = el;
    return obj;
  }, {});
}

// Entry for SVG icons sprite
const parseSvgEntries = (folder) => {
  return glob.sync(`./src/sprites/${folder}/*.svg`).reduce((entries, filepath) => {
    const name = path.basename(filepath, '.svg');
    entries[`${folder}/${name}`] = filepath;
    return entries;
  }, {});
}

module.exports = {
  entry: {
    ...parseSvgEntries('states'),
    ...parseSvgEntries('flags'),
    ...parseEntries('js/**.js', 'js', '.min'),
    ...parseEntries('scss/**.scss', 'css', '.min'),
  },
  output: {
    path: path.resolve(__dirname, 'expansa/dashboard/assets'),
  },
  optimization: {
    minimize: true,
    minimizer: [
      new CssMinimizerPlugin({
        minimizerOptions: {
          preset: [
            "default",
            {
              discardComments: { removeAll: true },
            },
          ],
        },
      }),
      new TerserPlugin({
        terserOptions: {
          format: {
            comments: false,
          },
        },
        extractComments: false,
      }),
    ],
  },
  mode: 'production',
  module: {
    rules: [
      {
        test: /\.svg$/,
        include: [
          path.resolve(__dirname, 'src/sprite'),
          path.resolve(__dirname, 'src/flags')
        ],
        use: [
          {
            loader: 'svg-sprite-loader',
            options: {
              extract: true,
              spriteFilename: (pathData) => {
                const folderName = pathData.match(/src[\\\/]sprites[\\\/]([^\\\/]+)/)[1];

                // Use 'pathData.resource' for resource path to determine correct folder
                return `sprites/${folderName}.svg`;
              },
            },
          },
          {
            loader: 'svgo-loader',
          },
        ],
      },
      {
        test: /\.(sass|scss)$/,
        include: path.resolve(__dirname, 'src/scss'),
        use: [
          {
            loader: MiniCssExtractPlugin.loader,
            options: {},
          },
          {
            loader: 'css-loader',
            options: {
              sourceMap: false,
              url: false,
              importLoaders: 1
            },
          },
          {
            loader: 'postcss-loader',
            options: {
              postcssOptions: {
                plugins: [
                  require('autoprefixer'),
                ],
              },
            },
          },
          {
            loader: 'sass-loader',
            options: {
              implementation: require('sass'),
              sourceMap: false,
            },
          },
        ],
      },
    ],
  },
  plugins: [
    new SpriteLoaderPlugin(),
    new MiniCssExtractPlugin({
      filename: '[name].css'
    }),
    new CleanWebpackPlugin({
      cleanOnceBeforeBuildPatterns: [],
      cleanAfterEveryBuildPatterns: ['./states', './flags', 'css/**.js'],
    }),
    new CopyPlugin({
      patterns: [
        {
          from: 'src/files',
          to: 'files',
          noErrorOnMissing: true,
        },
        {
          from: 'src/fonts',
          to: 'fonts',
          noErrorOnMissing: true,
        },
        {
          from: 'src/images',
          to: 'images',
          noErrorOnMissing: true,
        },
        {
          from: 'src/css',
          to: 'css',
          noErrorOnMissing: true,
        },
      ],
    }),
    // Remove unexpected .js and .php files, generated for scss entries (like 'inline' folder)
    new RemoveEmptyScriptsPlugin({
      stage: RemoveEmptyScriptsPlugin.STAGE_BEFORE_PROCESS_PLUGINS,
    }),
  ],
}