Webpack Customizers

/**
 * Remove ESLint from webpack configuration
 * Filters out rules that use eslint-loader
 * @returns {Function} Configuration customizer function
 */
function disableEsLint();

const { override, disableEsLint } = require("customize-cra");

module.exports = override(
  disableEsLint()
);

/**
 * Add webpack resolve aliases
 * Creates resolve and alias objects if they don't exist
 * @param {Object} alias - Object mapping alias names to paths
 * @returns {Function} Configuration customizer function
 */
function addWebpackAlias(alias);

const path = require("path");

module.exports = override(
  addWebpackAlias({
    "@components": path.resolve(__dirname, "src/components"),
    "@utils": path.resolve(__dirname, "src/utils"),
    "ag-grid-react$": path.resolve(__dirname, "src/shared/agGridWrapper.js")
  })
);

/**
 * Add webpack resolve configuration
 * Merges provided resolve options with existing configuration
 * @param {Object} resolve - Webpack resolve configuration object
 * @returns {Function} Configuration customizer function
 */
function addWebpackResolve(resolve);

/**
 * Add plugin to webpack configuration
 * Pushes plugin to the plugins array
 * @param {Object} plugin - Webpack plugin instance
 * @returns {Function} Configuration customizer function
 */
function addWebpackPlugin(plugin);

const webpack = require("webpack");

module.exports = override(
  addWebpackPlugin(
    new webpack.DefinePlugin({
      "process.env.API_URL": JSON.stringify(process.env.API_URL)
    })
  )
);

/**
 * Add webpack-bundle-analyzer plugin
 * Requires 'webpack-bundle-analyzer' to be installed
 * @param {Object} options - Bundle analyzer options (default: {analyzerMode: "static", reportFilename: "report.html"})
 * @param {boolean} behindFlag - Whether to only enable with --analyze flag (default: false)
 * @returns {Function} Configuration customizer function
 */
function addBundleVisualizer(options = {}, behindFlag = false);

// Always enabled
module.exports = override(
  addBundleVisualizer()
);

// Only when --analyze flag is used
module.exports = override(
  addBundleVisualizer({}, true)
);

// Custom options
module.exports = override(
  addBundleVisualizer({
    analyzerMode: "server",
    analyzerPort: 8888
  })
);

/**
 * Modify Workbox service worker configuration
 * Finds GenerateSW plugin and applies adjustment function
 * @param {Function} adjust - Function that receives and modifies workbox config
 * @returns {Function} Configuration customizer function
 */
function adjustWorkbox(adjust);

module.exports = override(
  adjustWorkbox(wb =>
    Object.assign(wb, {
      skipWaiting: true,
      exclude: (wb.exclude || []).concat("index.html")
    })
  )
);

/**
 * Find and modify all style loaders
 * Detects production vs development mode and finds appropriate loaders
 * @param {Function} callback - Function called for each style loader
 * @returns {Function} Configuration customizer function
 */
function adjustStyleLoaders(callback);

// Enable source maps for CSS in development
module.exports = override(
  adjustStyleLoaders(({ use: [, css, postcss, resolve, processor] }) => {
    css.options.sourceMap = true;
    postcss.options.sourceMap = true;
    if (resolve) {
      resolve.options.sourceMap = true;
    }
    if (processor && processor.loader.includes('sass-loader')) {
      processor.options.sourceMap = true;
    }
  })
);

/**
 * Enable .eslintrc file usage
 * Modifies eslint-loader options to use external config
 * @param {string} configFile - Optional path to specific ESLint config file
 * @returns {Function} Configuration customizer function
 */
function useEslintRc(configFile);

/**
 * Enable ESLint for TypeScript files
 * Updates eslint rule test pattern to include .ts and .tsx files
 * @returns {Function} Configuration customizer function
 */
function enableEslintTypescript();

/**
 * Add Less CSS preprocessor support
 * Requires 'less' and 'less-loader' packages to be installed
 * @param {Object} loaderOptions - Less loader options (default: {})
 * @param {Object} customCssModules - Custom CSS modules configuration (default: {})
 * @returns {Function} Configuration customizer function
 */
function addLessLoader(loaderOptions = {}, customCssModules = {});

// Basic Less support
module.exports = override(
  addLessLoader()
);

// With Less options and CSS Modules
module.exports = override(
  addLessLoader({
    strictMath: true,
    noIeCompat: true,
    modifyVars: {
      "@primary-color": "#1DA57A"
    },
    cssLoaderOptions: {},
    cssModules: {
      localIdentName: "[path][name]__[local]--[hash:base64:5]"
    }
  })
);

/**
 * Enable watching all files including node_modules
 * Only activates when --watch-all command line argument is present
 * @returns {Function} Configuration customizer function
 */
function watchAll();

/**
 * Disable webpack code splitting
 * Sets splitChunks to default: false and disables runtimeChunk
 * @returns {Function} Configuration customizer function
 */
function disableChunk();

/**
 * Add external dependencies for CDN usage
 * Accepts string, array, function, regex, or object formats
 * @param {string|Array|Function|RegExp|Object} externalDeps - External dependencies configuration
 * @returns {Function} Configuration customizer function
 */
function addWebpackExternals(externalDeps);

// Object format for CDN libraries
module.exports = override(
  addWebpackExternals({
    react: "React",
    "react-dom": "ReactDOM"
  })
);

/**
 * Add PostCSS plugins to configuration
 * Finds postcss-loader and adds plugins to existing or new plugins array
 * @param {Array} plugins - Array of PostCSS plugins
 * @returns {Function} Configuration customizer function
 */
function addPostcssPlugins(plugins);

module.exports = override(
  addPostcssPlugins([
    require("postcss-px2rem")({ remUnit: 37.5 })
  ])
);

/**
 * Remove CRA's module scope restriction
 * Filters out ModuleScopePlugin from resolve plugins
 * @returns {Function} Configuration customizer function
 */
function removeModuleScopePlugin();

/**
 * Add custom webpack module rule
 * Adds rule to the beginning of the oneOf array
 * @param {Object} rule - Webpack module rule object
 * @returns {Function} Configuration customizer function
 */
function addWebpackModuleRule(rule);

module.exports = override(
  addWebpackModuleRule({
    test: /\.txt$/,
    use: 'raw-loader'
  })
);

/**
 * Add TSLint loader for TypeScript linting
 * Requires 'tslint-loader' package to be installed
 * @param {Object} options - TSLint loader options
 * @returns {Function} Configuration customizer function
 */
function addTslintLoader(options);

/**
 * Set webpack target environment
 * @param {string|Function} target - Webpack target (e.g., 'electron-renderer', 'node')
 * @returns {Function} Configuration customizer function
 */
function setWebpackTarget(target);

/**
 * Override webpack output public path
 * Normalizes path by adding leading/trailing slashes as needed
 * @param {string} path - Public path for assets (e.g., '/static/', 'https://cdn.example.com/')
 * @returns {Function} Configuration customizer function
 */
function setWebpackPublicPath(path);

/**
 * Configure webpack chunk splitting optimization
 * @param {Object} splitChunks - SplitChunksPlugin configuration object
 * @returns {Function} Configuration customizer function
 */
function setWebpackOptimizationSplitChunks(splitChunks);

/**
 * Configure webpack build statistics output
 * @param {string|Object} stats - Webpack stats configuration
 * @returns {Function} Configuration customizer function
 */
function setWebpackStats(stats);

// Simple stats setting
module.exports = override(
  setWebpackStats('errors-only')
);

// Advanced stats with warning filtering
module.exports = override(
  setWebpackStats({
    warningsFilter: [
      'filter',
      /filter/,
      (warning) => true
    ]
  })
);