@ventum-digital/iiq-plugin-project-generator/templates/module/base/webpack.config.cjs

A npm tool to set-up the project structure for developing an IIQ Plugin.

/*
 * Copyright (c) 2025 Ventum Consulting GmbH
 */

const path              = require('path');
const glob              = require("glob");
const WebpackObfuscator = require('webpack-obfuscator');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const CopyWebpackPlugin = require('copy-webpack-plugin');

let entries = {};

function addFiles(globPattern) {
  glob.sync(globPattern)
      .map(s => "./" + s.replace(/\\/g, '/'))
      .forEach(file => {
        let name = path.basename(file, path.extname(file)); // Get file name without extension
        entries[name] = file; // Flatten output
      });
}

function exclude(fileName) {
  delete entries[fileName];
}

// Process JS files in the ./js folder
addFiles("./build/**/*.{js,jsx}");



module.exports = (env, argv) => {
  const isDevelopment = argv.mode === 'development';

  return {
    entry: entries,

    experiments: {
      outputModule: true,
    },

    output: {
      path    : path.resolve(__dirname, 'dist'), // Output directory
      filename: '[name].js', // Output file name
      library: {
        type: 'module',
      },
      globalObject: 'this',          // Ensure compatibility with Node.js
      clean: true,                   // Clean the output folder before building
    },

    resolve: {
      extensions: [".ts", ".tsx", ".js", ".jsx"], // Add .ts and .tsx
    },

    module: {
      rules: [
        {
          test: /\.((s[ac])|c)ss$/i,
          use : [
            MiniCssExtractPlugin.loader,
            "css-loader",
            "sass-loader",
          ],
        },
        {
          test: /\.css$/i,
          use : [
            MiniCssExtractPlugin.loader,
            "css-loader",
          ],
          include: /node_modules\/@ventum/, // Include only @ventum packages in node_modules
        },
        {
          test   : /\.(js|jsx)$/, // Process JS/JSX files
          exclude: /(node_modules|Util\.js)/,
          use    : [
            !isDevelopment && {
              loader: WebpackObfuscator.loader, // Obfuscate only in production
              options: {
                rotateStringArray: true,
              },
            },
          ].filter(Boolean), // Filter out undefined loaders
        },
        {
          test: /\.(png|jpg|gif|svg)$/, // Handle images
          type: 'asset/resource',
        },
      ].filter(Boolean), // Filter out undefined rules
    },

    plugins: [
      new CopyWebpackPlugin({
        patterns: [
          {
            from: path.resolve(__dirname, 'build'), // Source folder containing .d.ts files
            to: path.resolve(__dirname, 'dist'),    // Destination folder
            globOptions: {
              ignore: ['**/*.js', '**/*.map'],      // Copy only .d.ts files
            },
            noErrorOnMissing: true,
          },
        ],
      }),
      new MiniCssExtractPlugin({
        filename: "[name].css",
      }),
    ],

    devtool: isDevelopment ? 'source-map' : false, // Generate source maps only in development

    mode: isDevelopment ? 'development' : 'production',
  };
};