/clean-entry-webpack-plugin

A webpack plugin to remove unwanted files which may have been created and output due to multiple entry points

Primary LanguageJavaScriptMIT LicenseMIT

Clean Entry Webpack Plugin

A webpack plugin to remove unwanted files which may have been created and output due to multiple entry points

This plugin supports only webpack@4 aka the latest and the greatest.

Problem

I have generally used Webpack with a javascript entry point. But this is not mandatory.

Webpack can have a css, sass or postcss entry point. Maybe others types as well, but I have not checked. However, one problem with a non-javascript entry point is that the postcss entry will still output a javascript file.

Even with specifying Webpack's output.filename as [name]-[hash].css generates a javascript file with a mis-named css extension. And ExtractTextPlugin solves it by extracting the css file from the bundle but the javascript file still remains.

This is of particular interest, for css-only Webpack builds ie. using Webpack where we might have used Gulp in the past.

This plugin removes:

  1. javascript files for entries
  2. references to (1) above from manifest.json, if you are using the webpack-manifest-plugin
  3. sourcemap files for entries

Usage

Install using npm or yarn

npm install clean-entry-webpack-plugin --save-dev
yarn add clean-entry-webpack-plugin --dev

In your webpack.config.js file:

const CleanEntryPlugin = require('clean-entry-webpack-plugin');

module.exports = {
  ...
  plugins: [
    new CleanEntryPlugin()
  ]
}

All Configuration Options

The CleanEntryPlugin accepts an object of options with the following attributes:

new CleanEntryPlugin({
  manifestPath: path.join(path.resolve(__dirname, 'data'), 'manifest.json')
  verbose: true
})
  • entries - a list of entries to clean. defaults to all of Webpack's entries.
  • manifestPath - full path to the manifest.json file (not relative), if any. Build does not fail if path does not exist.
  • verbose - log which files are deleted. defaults to false.
  • dryRun - do not actually delete any files. assumes verbose. defaults to false

Development

brew works on OSX and Linux

brew install yarn git-hooks
git hooks --install
echo "to test commit message without actually commiting" | commitlint
# inside this plugin
yarn link
# in your webpack project
yarn link "clean-entry-webpack-plugin"

TODO

  • have tried only with webpack-manifest-plugin. how to handle other alternatives ?
  • add tests
  • tested on OSX. need to test on Windows
  • supports only webpack 4
  • annotate options with typescript

CREDITS