A Webpack plugin to remove empty JavaScript files generated when using style only entries.

Problem this plugin solves

By default, Webpack creates a JavaScript file for every entry specified in the entry option - even when the entry is a style file (like SCSS or CSS).

Example:

module.exports = {
  entry: {
    styles: './styles.scss',
  },
}

Output:

dist/styles.css
dist/styles.js // <= unwanted empty JS file

When using mini-css-extract-plugin, CSS is correctly extracted into a separate file, but Webpack still emits an empty JavaScript file for each style-only entry - the known issue.

This plugin detects and removes those redundant .js files automatically, keeping your output clean.

Note

This plugin is compatible with Webpack 5. For Webpack 4 use webpack-fix-style-only-entries.

Install

npm install webpack-remove-empty-scripts --save-dev

See the full documentation on GitHub.