{"id":15285,"library":"webpack-remove-empty-scripts","title":"Webpack Remove Empty Scripts Plugin","description":"webpack-remove-empty-scripts is a Webpack plugin designed to eliminate superfluous empty JavaScript files generated by Webpack 5, particularly when an `entry` point consists solely of style assets (e.g., SCSS or CSS files). This issue frequently occurs even when `mini-css-extract-plugin` correctly processes and extracts styles into dedicated CSS files, leaving behind an empty `.js` file for each style entry. The plugin automatically detects and removes these redundant outputs, ensuring a cleaner and more efficient build directory. The current stable version is `1.1.1`, and the project demonstrates an active maintenance cadence with minor releases and patches occurring every few months. Its primary utility lies in streamlining the build output for Webpack 5 projects that heavily utilize CSS preprocessors and separate style extraction.","status":"active","version":"1.1.1","language":"javascript","source_language":"en","source_url":"https://github.com/webdiscus/webpack-remove-empty-scripts","tags":["javascript","webpack","plugin","remove","empty","script","entry","style","scss","typescript"],"install":[{"cmd":"npm install webpack-remove-empty-scripts","lang":"bash","label":"npm"},{"cmd":"yarn add webpack-remove-empty-scripts","lang":"bash","label":"yarn"},{"cmd":"pnpm add webpack-remove-empty-scripts","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"This is a Webpack plugin and requires Webpack to function.","package":"webpack","optional":false}],"imports":[{"note":"The plugin class is the default export of the package. For CommonJS, use `const RemoveEmptyScriptsPlugin = require('webpack-remove-empty-scripts');`","wrong":"import { RemoveEmptyScriptsPlugin } from 'webpack-remove-empty-scripts';","symbol":"RemoveEmptyScriptsPlugin","correct":"import RemoveEmptyScriptsPlugin from 'webpack-remove-empty-scripts';"},{"note":"This constant is a static property of the `RemoveEmptyScriptsPlugin` class, used for fine-tuning the plugin's execution stage within Webpack's build process.","wrong":"import { STAGE_AFTER_PROCESS_PLUGINS } from 'webpack-remove-empty-scripts';","symbol":"STAGE_AFTER_PROCESS_PLUGINS","correct":"import RemoveEmptyScriptsPlugin from 'webpack-remove-empty-scripts';\n// Then use: RemoveEmptyScriptsPlugin.STAGE_AFTER_PROCESS_PLUGINS"},{"note":"This TypeScript type definition can be used for explicit type hinting of the plugin's configuration options when defining a Webpack configuration.","symbol":"RemoveEmptyScriptsPluginOptions","correct":"import type { RemoveEmptyScriptsPluginOptions } from 'webpack-remove-empty-scripts';"}],"quickstart":{"code":"import RemoveEmptyScriptsPlugin from 'webpack-remove-empty-scripts';\nimport MiniCssExtractPlugin from 'mini-css-extract-plugin';\nimport path from 'path';\n\nexport default {\n  entry: {\n    main: './src/index.js',\n    styles: './src/styles.scss', // This will generate an empty JS file without the plugin\n    legacyCss: './src/legacy.css',\n  },\n  output: {\n    path: path.resolve(__dirname, 'dist'),\n    filename: '[name].js',\n    clean: true, // Clean the output directory before emit.\n  },\n  module: {\n    rules: [\n      {\n        test: /\\.(scss|css)$/,\n        use: [\n          MiniCssExtractPlugin.loader,\n          'css-loader',\n          'sass-loader'\n        ],\n      },\n      {\n        test: /\\.js$/,\n        exclude: /node_modules/,\n        use: {\n          loader: 'babel-loader',\n          options: { presets: ['@babel/preset-env'] }\n        }\n      }\n    ],\n  },\n  plugins: [\n    new MiniCssExtractPlugin({\n      filename: '[name].css',\n    }),\n    new RemoveEmptyScriptsPlugin({\n      // Optional: Set to true for more detailed output during build\n      verbose: process.env.NODE_ENV === 'development',\n      // Optional: If you need to revert to v0.8.2-0.8.4 behavior for specific compatibility\n      // stage: RemoveEmptyScriptsPlugin.STAGE_AFTER_PROCESS_PLUGINS,\n    }),\n  ],\n  devtool: 'source-map',\n  mode: process.env.NODE_ENV === 'production' ? 'production' : 'development'\n};","lang":"typescript","description":"This configuration demonstrates how to integrate `webpack-remove-empty-scripts` into a Webpack 5 setup, ensuring that empty JavaScript files are not generated for style-only entry points when using `mini-css-extract-plugin`."},"warnings":[{"fix":"If you need the previous `v0.8.2-v0.8.4` behavior where the plugin ran after most others, configure it explicitly with `new RemoveEmptyScriptsPlugin({ stage: RemoveEmptyScriptsPlugin.STAGE_AFTER_PROCESS_PLUGINS })`.","message":"The default plugin execution stage was reverted in v1.0.1. It now executes before other plugins, which is generally the desired behavior but might alter how it interacts if you previously relied on its post-processing in versions v0.8.2-v0.8.4.","severity":"breaking","affected_versions":">=1.0.1"},{"fix":"For Webpack 4 projects, use `webpack-fix-style-only-entries` instead. Ensure your project's `webpack` dependency meets the `'>=5.32.0'` requirement.","message":"This plugin is designed exclusively for Webpack 5. It is not compatible with Webpack 4, and attempting to use it with older Webpack versions will likely result in build failures or simply no effect.","severity":"gotcha","affected_versions":"<5.0.0"},{"fix":"If you encounter unexpected interactions with other plugins, try adjusting the plugin's execution order by setting the `stage` option, e.g., `stage: RemoveEmptyScriptsPlugin.STAGE_AFTER_PROCESS_PLUGINS`.","message":"While the default `stage` was optimized in v1.0.1, in very complex Webpack configurations with multiple plugins, you might still need to explicitly configure the `stage` option if other plugins temporarily require the presence of all generated script files before removal.","severity":"gotcha","affected_versions":">=0.8.0"}],"env_vars":null,"last_verified":"2026-04-21T00:00:00.000Z","next_check":"2026-07-20T00:00:00.000Z","problems":[{"fix":"For ESM, change `import { RemoveEmptyScriptsPlugin } from 'webpack-remove-empty-scripts';` to `import RemoveEmptyScriptsPlugin from 'webpack-remove-empty-scripts';`. For CommonJS, use `const RemoveEmptyScriptsPlugin = require('webpack-remove-empty-scripts');`.","cause":"Attempting to import the default export (the plugin class) as a named export using curly braces, or incorrect CommonJS `require` usage.","error":"TypeError: RemoveEmptyScriptsPlugin is not a constructor"},{"fix":"Install the package as a development dependency: `npm install --save-dev webpack-remove-empty-scripts` or `yarn add --dev webpack-remove-empty-scripts`.","cause":"The package `webpack-remove-empty-scripts` has not been installed or is not correctly located in `node_modules`.","error":"Module not found: Error: Can't resolve 'webpack-remove-empty-scripts'"},{"fix":"Upgrade your project's Webpack version to `5.32.0` or higher: `npm install webpack@latest` or `yarn upgrade webpack`.","cause":"The installed version of `webpack` in your project is older than the minimum required by `webpack-remove-empty-scripts`.","error":"Peer dependency webpack (>=5.32.0) not met."}],"ecosystem":"npm"}