{"id":12663,"library":"webpack-addons","title":"webpack-addons","description":"webpack-addons is a utility suite designed to assist in creating webpack-cli addons by providing helper functions for common webpack configuration patterns and interactive Inquirer.js prompts. Originally published in 2017, its latest version is 1.1.5. This package is specifically tailored for scaffolding webpack configurations programmatically, offering utilities like `parseValue` for special string formatting, and `createArrowFunction` for dynamic entry points. A key differentiator was its inclusion of a `createCommonsChunkPlugin` helper, which is now deprecated in Webpack 4+ in favor of `optimization.splitChunks`. Given its last update date and the deprecation of core Webpack features it wraps, the package is considered unmaintained and potentially incompatible with modern webpack versions.","status":"abandoned","version":"1.1.5","language":"javascript","source_language":"en","source_url":"https://github.com/webpack-contrib/webpack-addons","tags":["javascript","scaffold","cli","webpack","ast"],"install":[{"cmd":"npm install webpack-addons","lang":"bash","label":"npm"},{"cmd":"yarn add webpack-addons","lang":"bash","label":"yarn"},{"cmd":"pnpm add webpack-addons","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"Use named destructuring from `require` for individual functions.","wrong":"import { parseValue } from 'webpack-addons'; /* This package is CommonJS only */","symbol":"parseValue","correct":"const { parseValue } = require('webpack-addons');"},{"note":"Access specific utilities as properties of the main `webpack-addons` export.","wrong":"import createArrowFunction from 'webpack-addons/createArrowFunction'; /* Incorrect import path and ESM syntax */","symbol":"createArrowFunction","correct":"const createArrowFunction = require('webpack-addons').createArrowFunction;"},{"note":"Inquirer prompt helpers like `List` are directly exported by the main package.","wrong":"require('webpack-addons/inquirer').List; /* Inquirer utilities are directly exported */","symbol":"List","correct":"const { List } = require('webpack-addons');"}],"quickstart":{"code":"const { parseValue, createArrowFunction, List } = require('webpack-addons');\n\n// Simulate a webpack-cli addon's generator context\nclass WebpackAddonGenerator {\n  constructor() {\n    this.configuration = {\n      myScaffold: {\n        webpackOptions: {}\n      }\n    };\n  }\n\n  // Example of applying utilities to webpack configuration\n  applyConfiguration() {\n    this.configuration.myScaffold.webpackOptions.output = {\n      sourcePrefix: parseValue('\\t\\t')\n    };\n    this.configuration.myScaffold.webpackOptions.entry = createArrowFunction('src/main.js');\n\n    console.log('Generated Webpack Output Source Prefix:', this.configuration.myScaffold.webpackOptions.output.sourcePrefix);\n    console.log('Generated Webpack Entry:', this.configuration.myScaffold.webpackOptions.entry());\n  }\n\n  // Example of using an Inquirer prompt (requires actual Inquirer setup in a CLI)\n  async promptUser() {\n    // In a real CLI, this would be await inquirer.prompt(...)\n    const entryChoice = List(\n      'entryType',\n      'What kind of entry do you want?',\n      ['String', 'Function', 'Object']\n    );\n    console.log('Simulated Inquirer List prompt for entryType:', entryChoice.name, entryChoice.choices);\n  }\n}\n\nconst generator = new WebpackAddonGenerator();\ngenerator.applyConfiguration();\ngenerator.promptUser();","lang":"javascript","description":"Demonstrates the use of `parseValue` for configuring webpack output, `createArrowFunction` for entry points, and the structure of an Inquirer `List` prompt utility within a simulated webpack-cli addon generator."},"warnings":[{"fix":"Avoid using `createCommonsChunkPlugin`. For code splitting, configure `optimization.splitChunks` directly in your webpack configuration for Webpack v4+.","message":"The `createCommonsChunkPlugin` utility provided by `webpack-addons` wraps Webpack's `CommonsChunkPlugin`, which was officially removed in Webpack v4. Using this utility with Webpack v4 or newer will result in an error or unexpected behavior, as the underlying plugin no longer exists. Modern Webpack uses `optimization.splitChunks` for code splitting.","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"If integrating into an ESM project, consider using dynamic `import()` or a CommonJS wrapper. Best practice is to avoid this package in new ESM-first projects unless a specific, non-breaking utility is absolutely required.","message":"This package is CommonJS-only, relying on `require()` for module imports. It does not provide ESM exports, meaning direct `import` statements in an ES Module context will fail. This limits its compatibility in modern JavaScript projects that primarily use ESM.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Thoroughly test compatibility with your specific environment. For new projects, consider modern alternatives or reimplementing the necessary utility functions directly.","message":"The `webpack-addons` package appears to be unmaintained, with its last known update being in 2017. This means it may not be compatible with recent versions of Node.js, `webpack-cli`, or Webpack itself, and will not receive security patches or bug fixes for new issues. Proceed with caution when integrating into current projects.","severity":"gotcha","affected_versions":">=1.1.5"},{"fix":"Create a `webpack-addons.d.ts` file in your project or use a community-maintained `@types/webpack-addons` if available (though unlikely for an unmaintained package). Define interfaces for the exported functions to gain type checking benefits.","message":"The package does not ship with TypeScript type definitions. Developers using TypeScript will need to create their own declaration files (`.d.ts`) or use `any` types, leading to a loss of type safety and IDE assistance when interacting with `webpack-addons`'s utilities.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"fix":"Remove all calls to `createCommonsChunkPlugin`. Implement code splitting using Webpack's `optimization.splitChunks` configuration instead.","cause":"Attempting to use `createCommonsChunkPlugin` with Webpack v4 or newer, where `CommonsChunkPlugin` has been removed.","error":"TypeError: webpack.optimize.CommonsChunkPlugin is not a constructor"},{"fix":"Replace `import` statements with CommonJS `require()` syntax, e.g., `const { parseValue } = require('webpack-addons');`. Ensure your file is treated as CommonJS (e.g., `.js` extension without `\"type\": \"module\"` in `package.json`).","cause":"Attempting to use ES module `import` syntax (`import { ... } from 'webpack-addons'`) in a CommonJS module context, or when Node.js is not configured for ESM.","error":"SyntaxError: Cannot use import statement outside a module"}],"ecosystem":"npm"}