{"id":18948,"library":"add-asset-webpack-plugin","title":"add-asset-webpack-plugin","description":"Dynamically add an asset (file) to the Webpack output graph. This is a lightweight, zero-dependency Webpack plugin (v3.1.1) that lets you inject a file with a given source string, either statically or via a callback receiving the compilation object. It ships TypeScript types. Key differentiator: it only creates output assets, not virtual modules — use webpack-virtual-modules if you need importable modules. Supports Webpack >=5, Node >=18, ESM only. Maintained by Sindre Sorhus.","status":"active","version":"3.1.1","language":"javascript","source_language":"en","source_url":"https://github.com/sindresorhus/add-asset-webpack-plugin","tags":["javascript","webpack-plugin","webpack","add","generate","create","make","asset","file","typescript"],"install":[{"cmd":"npm install add-asset-webpack-plugin","lang":"bash","label":"npm"},{"cmd":"yarn add add-asset-webpack-plugin","lang":"bash","label":"yarn"},{"cmd":"pnpm add add-asset-webpack-plugin","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"ESM-only since v3; require() will fail with ERR_REQUIRE_ESM.","wrong":"const AddAssetPlugin = require('add-asset-webpack-plugin')","symbol":"AddAssetPlugin","correct":"import AddAssetPlugin from 'add-asset-webpack-plugin'"},{"note":"Type is default export; named import produces undefined.","wrong":"import { AddAssetPlugin } from 'add-asset-webpack-plugin'","symbol":"AddAssetPlugin (type)","correct":"import type AddAssetPlugin from 'add-asset-webpack-plugin'"},{"note":"If you must use dynamic import, await the import and access .default. .default on require() gives undefined.","wrong":"const AddAssetPlugin = require('add-asset-webpack-plugin').default","symbol":"AddAssetPlugin (default import with require)","correct":"const AddAssetPlugin = (await import('add-asset-webpack-plugin')).default"}],"quickstart":{"code":"import AddAssetPlugin from 'add-asset-webpack-plugin';\n\nexport default {\n  plugins: [\n    new AddAssetPlugin('file.js', `\n      console.log('This is a dynamically created file');\n    `)\n  ]\n};\n","lang":"javascript","description":"Shows basic usage: instantiate plugin with file path and source string, then add to Webpack plugins array."},"warnings":[{"fix":"Use import (ESM) or switch to dynamic import with .default.","message":"v3.0.0 is ESM-only; require() throws ERR_REQUIRE_ESM.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Upgrade Node.js to 18+ or stay on v2.x (supports Node >=10).","message":"v3.0.0 requires Node.js >=18.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Use Webpack 5+ or stick with v1.x (supports Webpack 4).","message":"v2.0.0 requires Webpack >=5.","severity":"breaking","affected_versions":">=2.0.0"},{"fix":"Use webpack-virtual-modules if you need importable virtual files.","message":"This plugin creates output assets, not virtual modules; they cannot be imported by other modules during compilation.","severity":"gotcha","affected_versions":"*"},{"fix":"Use a unique relative path, e.g., 'assets/generated.js'.","message":"The source is written to the output directory; ensure the filePath does not collide with other output files.","severity":"gotcha","affected_versions":"*"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Use import instead, or use dynamic import: const AddAssetPlugin = (await import('add-asset-webpack-plugin')).default;","cause":"Trying to require() the ESM-only package.","error":"Error [ERR_REQUIRE_ESM]: require() of ES Module"},{"fix":"Use import AddAssetPlugin from 'add-asset-webpack-plugin'.","cause":"Named import { AddAssetPlugin } instead of default import.","error":"TypeError: AddAssetPlugin is not a constructor"},{"fix":"Use const { default: AddAssetPlugin } = require('add-asset-webpack-plugin'); or switch to dynamic import.","cause":"CommonJS require returns an object with a 'default' property, not the class itself.","error":"AddAssetPlugin is not a constructor (when using require)"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}