JavaScript by Example

PurifyCSSPlugin

When building web applications, there will be a lot of styles that are defined in CSS but are never used in HTML. PurifyCSSPlugin will go through all the HTML files and remove any unnecessary CSS styles that we have defined before bundling the code. To use PurifyCSSPlugin, we need to install the purifycss-webpack package:

npm install -D purifycss-webpack

After that, import the plugin to your Webpack configuration file and use it as specified in the following code:

const PurifyCSSPlugin = require('purifycss-webpack');constglob = require('glob');module.exports = {  ...  plugins: [    ...    new PurifyCSSPlugin({      paths: glob.sync(__dirname + '/*.html'),      minimize: true,    }),  ],}

glob is an inbuilt module in Node.js. We specify the paths ...