From 1323389a2a0a4ea8f81301164af96c3783f68439 Mon Sep 17 00:00:00 2001 From: Ingwie Phoenix Date: Wed, 13 Jan 2016 18:35:49 +0100 Subject: [PATCH 001/168] 2.0.0: Now based on my previous implementation; just being official now. --- package.json | 24 +++++++++++------------- 1 file changed, 11 insertions(+), 13 deletions(-) diff --git a/package.json b/package.json index 585bbfd..9628903 100644 --- a/package.json +++ b/package.json @@ -1,29 +1,27 @@ { - "name": "bird3-purifycss-webpack-plugin", - "version": "1.0.9", - "description": "BIRD3's PurifyCSS WebPack plugin. Time to clean your styles!", + "name": "purifycss-webpack-plugin", + "version": "2.0.0", + "description": "PurifyCSS plugin for webpack", "main": "index.js", "scripts": { - "test": "echo 'No test command available, yet.' && exit 1" + "test": "echo \"No test suite for this version, yet.\" && exit 0" }, "repository": { "type": "git", - "url": "git+https://github.com/DragonsInn/bird3-purifycss-webpack-plugin.git" + "url": "https://github.com/purifycss/purifycss-webpack-plugin.git" }, "keywords": [ - "purify-css", - "purifycss", "webpack", + "uncss", "plugin", - "purify", - "css" + "purify" ], - "author": "Ingwie Phoenix ", - "license": "MIT", + "author": "Kenny Tran, Matthew Rourke, Phoebe Li, Kevin \"Ingwie Phoenix\" Ingwersen", + "license": "ISC", "bugs": { - "url": "https://github.com/DragonsInn/bird3-purifycss-webpack-plugin/issues" + "url": "https://github.com/purifycss/purifycss-webpack-plugin/issues" }, - "homepage": "https://github.com/DragonsInn/bird3-purifycss-webpack-plugin#readme", + "homepage": "https://github.com/purifycss/purifycss-webpack-plugin", "dependencies": { "glob": "^5.0.15", "purify-css": "^1.0.17" From 70d1f1769f3dc1b77da1f9571d41878038a1880b Mon Sep 17 00:00:00 2001 From: Ingwie Phoenix Date: Wed, 13 Jan 2016 18:42:42 +0100 Subject: [PATCH 002/168] Updated README.md --- README.md | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 2abedef..e577258 100644 --- a/README.md +++ b/README.md @@ -4,6 +4,11 @@ This is a plugin for WebPack that utilizes PurifyCSS to clean your CSS. Its dead So, let's go and clean some style! +## IMPORTANT: 1.x to 2.x - new implementation. +This release introduces **breaking changes** from `1.x` to `2.x` - and a lot of them at that. The new implementation is now based on @IngwiePhoenix's [previous implementation](https://github.com/DragonsInn/bird3-purifycss-webpack-plugin). See the config options and configuration snippets below! + +You can still use the older version by using the `PurifyCSS/Legacy` branch, or installing `purifycss-loader` - it still uses the old `1.x` releases, but is **deprecated**. + ## Dependencies - WebPack must be already installed, so that this plugin can use it's library parts. - You **should** use the `extract-text-webpack-plugin` - although, you are not enforced to. Without any CSS file being emitted as an asset, this plugin will not do a thing except idle about inside the compiler. You can also use the `file` plugin to drop a special CSS file into your output folder, but I highly recommend the extract plugin. @@ -11,7 +16,7 @@ So, let's go and clean some style! ## Use First, get it: - npm install --save bird3-purifycss-webpack-plugin + npm install --save purifycss-webpack-plugin Let's assume you have a basic webpack configuration like so: @@ -37,7 +42,7 @@ Now, all we add, is another plugin definition. Please note: Plugins seem to be e ```javascript var extractor = require("extract-text-webpack-plugin"); -var purify = require("bird3-purifycss-webpack-plugin"); +var purify = require("purifycss-webpack-plugin"); module.exports = { entry: "app.js", output: { @@ -72,6 +77,3 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | `resolveExtensions` | An array of extensions that should be given to PurifyCSS when determining classes. (defaults to webpack `resolve.extensions` config) | `paths` | An array of globs that reveal all your files. See [glob](http://npmjs.org/glob)'s documentation to see what kind of paths you can pass in this array. Use this array to pass files that won't be known to WebPack. | `purifyOptions` | Pass these options to PurifyCSS. See [here](https://github.com/purifycss/purifycss#options-optional). Note: `output` is always `false`. - -## Notes -This plugin is NOT a fork of [the offical plugin](https://github.com/purifycss/purifycss-webpack-plugin)! Instead, this is it's own. I prefixed it with `bird3`, since it was created within my [BIRD3](https://github.com/DragonsInn/BIRD3) project and to make an obvious separation to the offical version. From d5a3efe481017a882f0df47c5d1c482884db4a4d Mon Sep 17 00:00:00 2001 From: Ingwie Phoenix Date: Wed, 13 Jan 2016 19:01:12 +0100 Subject: [PATCH 003/168] Patchlevel bump, so that NPM lets me update the README. --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 9628903..d8c8f31 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack-plugin", - "version": "2.0.0", + "version": "2.0.1", "description": "PurifyCSS plugin for webpack", "main": "index.js", "scripts": { From 21e13ac184b9a441da9c876860ed935a7e1824c7 Mon Sep 17 00:00:00 2001 From: Ingwie Phoenix Date: Tue, 9 Feb 2016 09:31:00 +0100 Subject: [PATCH 004/168] Now using PurifyCSS 1.1.1+ This only causes a minor version-bump since the API and everything stays un-broken. --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index d8c8f31..d4e7bec 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack-plugin", - "version": "2.0.1", + "version": "2.0.2", "description": "PurifyCSS plugin for webpack", "main": "index.js", "scripts": { @@ -24,6 +24,6 @@ "homepage": "https://github.com/purifycss/purifycss-webpack-plugin", "dependencies": { "glob": "^5.0.15", - "purify-css": "^1.0.17" + "purify-css": "^1.1.1" } } From c139bc687fedd5f17679c397cb0ce9dbbf5f3036 Mon Sep 17 00:00:00 2001 From: Ingwie Phoenix Date: Tue, 9 Feb 2016 09:32:51 +0100 Subject: [PATCH 005/168] -ignore files now include node_modules and log files. --- .gitignore | 1 + .npmignore | 2 ++ 2 files changed, 3 insertions(+) create mode 100644 .npmignore diff --git a/.gitignore b/.gitignore index c2658d7..552f221 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ node_modules/ +*.log diff --git a/.npmignore b/.npmignore new file mode 100644 index 0000000..552f221 --- /dev/null +++ b/.npmignore @@ -0,0 +1,2 @@ +node_modules/ +*.log From 10fe6466f203fe2ef091164de3e918ceb0a40d3a Mon Sep 17 00:00:00 2001 From: Rahav Lussto Date: Thu, 11 Feb 2016 11:44:12 +0200 Subject: [PATCH 006/168] Update index.js to support webpack 2 --- index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.js b/index.js index 3265401..db2bec2 100644 --- a/index.js +++ b/index.js @@ -1,7 +1,7 @@ var purify = require("purify-css"); var glob = require("glob").sync; var path = require("path"); -var ConcatSource = require("webpack/lib/ConcatSource"); +var ConcatSource = require("webpack-sources").ConcatSource; module.exports = function PurifyPlugin(options) { // Store the user's options From 445569c08609aad8631856dd5438da35973688bd Mon Sep 17 00:00:00 2001 From: Rahav Lussto Date: Thu, 11 Feb 2016 11:53:22 +0200 Subject: [PATCH 007/168] Update package.json --- package.json | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/package.json b/package.json index d4e7bec..fce15bc 100644 --- a/package.json +++ b/package.json @@ -22,8 +22,12 @@ "url": "https://github.com/purifycss/purifycss-webpack-plugin/issues" }, "homepage": "https://github.com/purifycss/purifycss-webpack-plugin", + "peerDependencies": { + "webpack": "^1.9.11" + }, "dependencies": { "glob": "^5.0.15", + "webpack-sources": "^0.1.0", "purify-css": "^1.1.1" } } From 0f0d531e6a6993b6f05f43d6cddb886bbe17aa24 Mon Sep 17 00:00:00 2001 From: Ingwie Phoenix Date: Fri, 12 Feb 2016 03:17:52 +0100 Subject: [PATCH 008/168] Version bump and NPM release. --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index fce15bc..428e437 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack-plugin", - "version": "2.0.2", + "version": "2.0.3", "description": "PurifyCSS plugin for webpack", "main": "index.js", "scripts": { From 7c6452c52453480ff233331efdf70ffafc5efb95 Mon Sep 17 00:00:00 2001 From: Kenny Tran Date: Mon, 15 Feb 2016 11:16:27 -0800 Subject: [PATCH 009/168] Link back to purify package --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index e577258..5444881 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # PurifyCSS WebPack Plugin -This is a plugin for WebPack that utilizes PurifyCSS to clean your CSS. Its dead simple, but it requires you to be prepared. +This is a plugin for WebPack that utilizes [PurifyCSS](https://github.com/purifycss/purifycss) to clean your CSS. Its dead simple, but it requires you to be prepared. So, let's go and clean some style! From 574d5e47b5e48baed23381adf72e93b9734f5587 Mon Sep 17 00:00:00 2001 From: Rahav Lussto Date: Mon, 22 Feb 2016 17:43:09 +0200 Subject: [PATCH 010/168] Update Index.js to support hashes i'm using hash from ExtractTextPlugin so my css file name looks like : "styles.css?[contenthash]", therefore i needed to change the regex. --- index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.js b/index.js index db2bec2..2488815 100644 --- a/index.js +++ b/index.js @@ -44,7 +44,7 @@ module.exports.prototype.apply = function(compiler) { // Look for purifyable CSs... for(var key in compilation.assets) { - if(/\.css$/i.test(key)) { + if(/\.css/i.test(key)) { // We found a CSS. So purify it. var asset = compilation.assets[key]; var css = asset.source(); From a69ecdd0cb9b64f3b7c46a48fd9d09254d18047e Mon Sep 17 00:00:00 2001 From: Nenad Panic Date: Sun, 17 Apr 2016 19:06:12 +0200 Subject: [PATCH 011/168] support purify css by chunks --- index.js | 87 ++++++++++++++++++++++++++++++++++++++++++++++---------- 1 file changed, 72 insertions(+), 15 deletions(-) diff --git a/index.js b/index.js index 2488815..e61581a 100644 --- a/index.js +++ b/index.js @@ -26,6 +26,7 @@ module.exports.prototype.apply = function(compiler) { self.purifyOptions.output = false; // Path/files to check. If none supplied, an empty array will do. self.paths = self.userOptions.paths || []; + self.entryPaths = self.userOptions.entryPaths || []; // Additional extensions to scan for. This is kept minimal, for obvious reasons. // We are not opinionated... self.resolveExtensions = self.userOptions.resolveExtensions || compiler.options.resolve.extensions; @@ -35,24 +36,80 @@ module.exports.prototype.apply = function(compiler) { }, []); compilation.plugin("additional-assets", function(cb){ - // Look for additional JS/HTML stuff. - for(var key in compilation.fileDependencies) { - var file = compilation.fileDependencies[key]; - var ext = path.extname(file); - if (self.resolveExtensions.indexOf(ext) > -1) files.push(file); - } + if (compilation.chunks.length === 1 && compilation.chunks[0].name === 'main') { + // main chunk + // Look for additional JS/HTML stuff. + for(var key in compilation.fileDependencies) { + var file = compilation.fileDependencies[key]; + var ext = path.extname(file); + if (self.resolveExtensions.indexOf(ext) > -1) files.push(file); + } - // Look for purifyable CSs... - for(var key in compilation.assets) { - if(/\.css/i.test(key)) { - // We found a CSS. So purify it. - var asset = compilation.assets[key]; - var css = asset.source(); - var newCss = new ConcatSource(); - newCss.add(purify(files, css, self.purifyOptions)); - compilation.assets[key] = newCss; + // Look for purifyable CSs... + for(var key in compilation.assets) { + if(/\.css$/i.test(key)) { + // We found a CSS. So purify it. + var asset = compilation.assets[key]; + executePurification(files, asset, key); + } } + } else { + // multiple entry chunks + var cssAsset; + var assets = Object.keys(compilation.assets); + + compilation.chunks.forEach(function (chunk, i) { + // extract html chunk files + var key; + var error = false; + + if (self.entryPaths[chunk.name]) { + var chunkFiles = self.entryPaths[chunk.name].reduce(function (results, p) { + return results.concat(glob(path.join(self.basePath, p))); + }, []); + } else { + console.log('Wrong entryPath for ' + chunk.name); + error = true; + } + + // filter chunk modules for additional files to include ex. .js, .es6,... + var chunkModules = chunk.modules.filter(function (module) { + var ext = path.extname(module.resource); + return self.resolveExtensions.indexOf(ext) > -1; + }); + + // include additional modules + chunkFiles.concat(chunkModules); + + // find css asset + for (var k = 0; k < assets.length; k++){ + if (assets[k].indexOf(chunk.name) > -1 && path.extname(assets[k]) === '.css') { + cssAsset = compilation.assets[assets[k]]; + key = assets[k]; + break; + } + } + + if (cssAsset && !error) { + if (self.purifyOptions.info) { + console.log(chunk.name); + } + + executePurification(chunkFiles, cssAsset, key); + } else { + console.log('No CSS for chunk: ' + chunk.name); + } + }); + } + + function executePurification(files, cssAsset, key) { + var css = cssAsset.source(); + var newCss = new ConcatSource(); + + newCss.add(purify(files, css, self.purifyOptions)); + compilation.assets[key] = newCss; } + cb(); }); }); From 8f7739e57ac658bc0fb154d7841ebf316743b3c8 Mon Sep 17 00:00:00 2001 From: Nenad Panic Date: Sun, 17 Apr 2016 22:56:40 +0200 Subject: [PATCH 012/168] purify by chunks - refactor --- index.js | 70 ++++++++++++++++++++++++++------------------------------ 1 file changed, 33 insertions(+), 37 deletions(-) diff --git a/index.js b/index.js index e61581a..9fd466a 100644 --- a/index.js +++ b/index.js @@ -36,8 +36,8 @@ module.exports.prototype.apply = function(compiler) { }, []); compilation.plugin("additional-assets", function(cb){ - if (compilation.chunks.length === 1 && compilation.chunks[0].name === 'main') { - // main chunk + // check if there is only one chunk or if there are no entryPaths provided + if (compilation.chunks.length === 1 || !self.entryPaths) { // Look for additional JS/HTML stuff. for(var key in compilation.fileDependencies) { var file = compilation.fileDependencies[key]; @@ -49,61 +49,57 @@ module.exports.prototype.apply = function(compiler) { for(var key in compilation.assets) { if(/\.css$/i.test(key)) { // We found a CSS. So purify it. - var asset = compilation.assets[key]; - executePurification(files, asset, key); + executePurification(files, key); } } } else { // multiple entry chunks - var cssAsset; var assets = Object.keys(compilation.assets); compilation.chunks.forEach(function (chunk, i) { - // extract html chunk files var key; - var error = false; if (self.entryPaths[chunk.name]) { + // extract html chunk files var chunkFiles = self.entryPaths[chunk.name].reduce(function (results, p) { return results.concat(glob(path.join(self.basePath, p))); - }, []); - } else { - console.log('Wrong entryPath for ' + chunk.name); - error = true; - } - - // filter chunk modules for additional files to include ex. .js, .es6,... - var chunkModules = chunk.modules.filter(function (module) { - var ext = path.extname(module.resource); - return self.resolveExtensions.indexOf(ext) > -1; - }); - - // include additional modules - chunkFiles.concat(chunkModules); - - // find css asset - for (var k = 0; k < assets.length; k++){ - if (assets[k].indexOf(chunk.name) > -1 && path.extname(assets[k]) === '.css') { - cssAsset = compilation.assets[assets[k]]; - key = assets[k]; - break; + }, []); + + // filter chunk modules for additional files to include ex. .js, .es6,... + var chunkModules = chunk.modules.filter(function (module) { + var ext = path.extname(module.resource); + return self.resolveExtensions.indexOf(ext) > -1; + }); + + // include additional modules + chunkFiles.concat(chunkModules); + + // find css asset + for (var i = 0; i < assets.length; i++){ + if (assets[i].indexOf(chunk.name) > -1 && path.extname(assets[i]) === '.css') { + key = assets[i]; + break; + } } - } - if (cssAsset && !error) { - if (self.purifyOptions.info) { - console.log(chunk.name); - } + if (key) { + if (self.purifyOptions.info) { + console.log(chunk.name); + } - executePurification(chunkFiles, cssAsset, key); + executePurification(chunkFiles, key); + } else { + console.warn('No CSS for chunk: ' + chunk.name); + } } else { - console.log('No CSS for chunk: ' + chunk.name); + console.warn('No entryPath for chunk: ' + chunk.name); } }); } - function executePurification(files, cssAsset, key) { - var css = cssAsset.source(); + function executePurification(files, key) { + var asset = compilation.assets[key]; + var css = asset.source(); var newCss = new ConcatSource(); newCss.add(purify(files, css, self.purifyOptions)); From 283add77e46638eb6ea40de3df2885eabf1cc327 Mon Sep 17 00:00:00 2001 From: nenad_panic Date: Mon, 18 Apr 2016 11:52:41 +0200 Subject: [PATCH 013/168] purify by chunk - fix for chunk modules extraction --- index.js | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/index.js b/index.js index 9fd466a..1848fe1 100644 --- a/index.js +++ b/index.js @@ -26,13 +26,14 @@ module.exports.prototype.apply = function(compiler) { self.purifyOptions.output = false; // Path/files to check. If none supplied, an empty array will do. self.paths = self.userOptions.paths || []; + // chunk entry files. self.entryPaths = self.userOptions.entryPaths || []; // Additional extensions to scan for. This is kept minimal, for obvious reasons. // We are not opinionated... self.resolveExtensions = self.userOptions.resolveExtensions || compiler.options.resolve.extensions; var files = self.paths.reduce(function(results, p) { - return results.concat(glob(path.join(self.basePath, p))); + return results.concat(glob(path.join(self.basePath, p))); }, []); compilation.plugin("additional-assets", function(cb){ @@ -56,7 +57,7 @@ module.exports.prototype.apply = function(compiler) { // multiple entry chunks var assets = Object.keys(compilation.assets); - compilation.chunks.forEach(function (chunk, i) { + compilation.chunks.forEach(function (chunk) { var key; if (self.entryPaths[chunk.name]) { @@ -66,13 +67,12 @@ module.exports.prototype.apply = function(compiler) { }, []); // filter chunk modules for additional files to include ex. .js, .es6,... - var chunkModules = chunk.modules.filter(function (module) { - var ext = path.extname(module.resource); - return self.resolveExtensions.indexOf(ext) > -1; - }); - - // include additional modules - chunkFiles.concat(chunkModules); + for (var j = 0; j < chunk.modules.length; j++) { + var ext = path.extname(chunk.modules[j].resource); + if (self.resolveExtensions.indexOf(ext) > -1) { + chunkFiles.push(chunk.modules[j].resource); + } + } // find css asset for (var i = 0; i < assets.length; i++){ @@ -109,4 +109,4 @@ module.exports.prototype.apply = function(compiler) { cb(); }); }); -} +} \ No newline at end of file From 670b6b74396686f9149aa1c0daf78138bb649bed Mon Sep 17 00:00:00 2001 From: nenad_panic Date: Mon, 18 Apr 2016 12:51:47 +0200 Subject: [PATCH 014/168] purify by chunk - entryPaths fix --- index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.js b/index.js index 1848fe1..5a5633a 100644 --- a/index.js +++ b/index.js @@ -27,7 +27,7 @@ module.exports.prototype.apply = function(compiler) { // Path/files to check. If none supplied, an empty array will do. self.paths = self.userOptions.paths || []; // chunk entry files. - self.entryPaths = self.userOptions.entryPaths || []; + self.entryPaths = self.userOptions.entryPaths; // Additional extensions to scan for. This is kept minimal, for obvious reasons. // We are not opinionated... self.resolveExtensions = self.userOptions.resolveExtensions || compiler.options.resolve.extensions; From 9437e87c455caec43a831bdab995f5c5b360ff46 Mon Sep 17 00:00:00 2001 From: Cody Reichert Date: Sat, 11 Jun 2016 13:11:19 -0500 Subject: [PATCH 015/168] Fix link to purifycss optional options docs Looks like they slightly renamed it - just fixed the anchor. --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 5444881..83e056d 100644 --- a/README.md +++ b/README.md @@ -76,4 +76,4 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | `basePath` | The path from which all the other paths will start. Required. | `resolveExtensions` | An array of extensions that should be given to PurifyCSS when determining classes. (defaults to webpack `resolve.extensions` config) | `paths` | An array of globs that reveal all your files. See [glob](http://npmjs.org/glob)'s documentation to see what kind of paths you can pass in this array. Use this array to pass files that won't be known to WebPack. -| `purifyOptions` | Pass these options to PurifyCSS. See [here](https://github.com/purifycss/purifycss#options-optional). Note: `output` is always `false`. +| `purifyOptions` | Pass these options to PurifyCSS. See [here](https://github.com/purifycss/purifycss#the-optional-options-argument). Note: `output` is always `false`. From 59dad3d6c0fdec5a1d98846f98e0612eed356fe3 Mon Sep 17 00:00:00 2001 From: nenad_panic Date: Mon, 18 Apr 2016 11:38:42 +0200 Subject: [PATCH 016/168] purify by chunk - fix for exctrating chunk modules --- index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/index.js b/index.js index 5a5633a..a826a50 100644 --- a/index.js +++ b/index.js @@ -26,7 +26,7 @@ module.exports.prototype.apply = function(compiler) { self.purifyOptions.output = false; // Path/files to check. If none supplied, an empty array will do. self.paths = self.userOptions.paths || []; - // chunk entry files. + // chunk entry files. If none suplied, assume there is only one chunk self.entryPaths = self.userOptions.entryPaths; // Additional extensions to scan for. This is kept minimal, for obvious reasons. // We are not opinionated... @@ -38,7 +38,7 @@ module.exports.prototype.apply = function(compiler) { compilation.plugin("additional-assets", function(cb){ // check if there is only one chunk or if there are no entryPaths provided - if (compilation.chunks.length === 1 || !self.entryPaths) { + if (compilation.chunks.length === 1 || !self.userOptions.entryPaths) { // Look for additional JS/HTML stuff. for(var key in compilation.fileDependencies) { var file = compilation.fileDependencies[key]; From 779b7cf81ae50cfb5d9c0e62be030a691e9b62a7 Mon Sep 17 00:00:00 2001 From: Cody Reichert Date: Sat, 11 Jun 2016 13:11:19 -0500 Subject: [PATCH 017/168] Fix link to purifycss optional options docs Looks like they slightly renamed it - just fixed the anchor. --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 5444881..83e056d 100644 --- a/README.md +++ b/README.md @@ -76,4 +76,4 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | `basePath` | The path from which all the other paths will start. Required. | `resolveExtensions` | An array of extensions that should be given to PurifyCSS when determining classes. (defaults to webpack `resolve.extensions` config) | `paths` | An array of globs that reveal all your files. See [glob](http://npmjs.org/glob)'s documentation to see what kind of paths you can pass in this array. Use this array to pass files that won't be known to WebPack. -| `purifyOptions` | Pass these options to PurifyCSS. See [here](https://github.com/purifycss/purifycss#options-optional). Note: `output` is always `false`. +| `purifyOptions` | Pass these options to PurifyCSS. See [here](https://github.com/purifycss/purifycss#the-optional-options-argument). Note: `output` is always `false`. From b56e55acc41b78d2e2ebd8e1dfafdc612cd23672 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 12:22:27 +0200 Subject: [PATCH 018/168] chore - Update peer dependencies to support webpack 2 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 428e437..a7d75f3 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ }, "homepage": "https://github.com/purifycss/purifycss-webpack-plugin", "peerDependencies": { - "webpack": "^1.9.11" + "webpack": "^1.9.11 || ^2.1.0-beta.19 || ^2.2.0-rc.0" }, "dependencies": { "glob": "^5.0.15", From 81489282e20296450d79aa60f812bcb4821bc27c Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 12:33:26 +0200 Subject: [PATCH 019/168] Add license --- LICENSE.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 LICENSE.md diff --git a/LICENSE.md b/LICENSE.md new file mode 100644 index 0000000..73096ed --- /dev/null +++ b/LICENSE.md @@ -0,0 +1,5 @@ +Copyright 2017 Kenny Tran + +Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. \ No newline at end of file From 8f41305a29c82cf975495589d5ba6bfae5214b9c Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 12:33:37 +0200 Subject: [PATCH 020/168] Update meta --- package.json | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index a7d75f3..ce5693e 100644 --- a/package.json +++ b/package.json @@ -1,14 +1,14 @@ { - "name": "purifycss-webpack-plugin", + "name": "purify-webpack-plugin", "version": "2.0.3", - "description": "PurifyCSS plugin for webpack", + "description": "Unofficial PurifyCSS plugin for webpack", "main": "index.js", "scripts": { "test": "echo \"No test suite for this version, yet.\" && exit 0" }, "repository": { "type": "git", - "url": "https://github.com/purifycss/purifycss-webpack-plugin.git" + "url": "https://github.com/webpack-contrib/purify-webpack-plugin.git" }, "keywords": [ "webpack", @@ -19,9 +19,9 @@ "author": "Kenny Tran, Matthew Rourke, Phoebe Li, Kevin \"Ingwie Phoenix\" Ingwersen", "license": "ISC", "bugs": { - "url": "https://github.com/purifycss/purifycss-webpack-plugin/issues" + "url": "https://github.com/webpack-contrib/purify-webpack-plugin/issues" }, - "homepage": "https://github.com/purifycss/purifycss-webpack-plugin", + "homepage": "https://github.com/webpack-contrib/purify-webpack-plugin", "peerDependencies": { "webpack": "^1.9.11 || ^2.1.0-beta.19 || ^2.2.0-rc.0" }, From d2679f9f15d867982e17b7b366678a539d5eb2df Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 12:33:44 +0200 Subject: [PATCH 021/168] Update readme --- README.md | 91 ++++++++++++++++++++++++------------------------------- 1 file changed, 39 insertions(+), 52 deletions(-) diff --git a/README.md b/README.md index 83e056d..76d8ff9 100644 --- a/README.md +++ b/README.md @@ -1,74 +1,57 @@ -# PurifyCSS WebPack Plugin +# PurifyCSS WebPack Plugin (contrib fork) -This is a plugin for WebPack that utilizes [PurifyCSS](https://github.com/purifycss/purifycss) to clean your CSS. Its dead simple, but it requires you to be prepared. - -So, let's go and clean some style! +> **IMPORTANT: This is a friendly fork of [purifycss-webpack-plugin](https://github.com/purifycss/purifycss-webpack-plugin) with a slightly different API.** -## IMPORTANT: 1.x to 2.x - new implementation. -This release introduces **breaking changes** from `1.x` to `2.x` - and a lot of them at that. The new implementation is now based on @IngwiePhoenix's [previous implementation](https://github.com/DragonsInn/bird3-purifycss-webpack-plugin). See the config options and configuration snippets below! +This is a plugin for WebPack that utilizes [PurifyCSS](https://github.com/purifycss/purifycss) to clean your CSS. Its dead simple, but it requires you to be prepared. -You can still use the older version by using the `PurifyCSS/Legacy` branch, or installing `purifycss-loader` - it still uses the old `1.x` releases, but is **deprecated**. +You **should** use the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin) with this. Without any CSS file being emitted as an asset, this plugin will not do a thing except idle about inside the compiler. You can also use the `file` plugin to drop a special CSS file into your output folder, but it is highly recommend the extract plugin. -## Dependencies -- WebPack must be already installed, so that this plugin can use it's library parts. -- You **should** use the `extract-text-webpack-plugin` - although, you are not enforced to. Without any CSS file being emitted as an asset, this plugin will not do a thing except idle about inside the compiler. You can also use the `file` plugin to drop a special CSS file into your output folder, but I highly recommend the extract plugin. +## Usage -## Use First, get it: - npm install --save purifycss-webpack-plugin - -Let's assume you have a basic webpack configuration like so: - -```javascript -var extractor = require("extract-text-webpack-plugin"); -module.exports = { - entry: "app.js", - output: { - // ... - }, - module: { - loaders: [ - { test: /\.css$/, loader: extractor.loader("style","css") } - ] - }, - plugins: [ - new extractor("[name].css") - ] -} +```bash +npm install purify-webpack-plugin --save ``` -Now, all we add, is another plugin definition. Please note: Plugins seem to be executed in order, so make sure that this plugin comes _after_ the extract plugin, if you use it. +The configure as follows: ```javascript -var extractor = require("extract-text-webpack-plugin"); -var purify = require("purifycss-webpack-plugin"); +const path = require('path'); +const ExtractTextPlugin = require('extract-text-webpack-plugin'); +const PurifyPlugin = require('purify-webpack-plugin'); + module.exports = { - entry: "app.js", - output: { - // ... - }, - module: { - loaders: [ - { test: /\.css$/, loader: extractor.loader("style","css") } - ] - }, - plugins: [ - new extractor("[name].css"), - new purify({ - basePath: __dirname, - paths: [ - "app/views/*.html", - "app/layout/*.html" - ] + entry: {...}, + output: {...}, + module: { + rules: [ + { + test: /\.css$/, + loader: ExtractTextPlugin.extract({ + fallbackLoader: 'style-loader', + loader: 'css-loader' }) + } ] -} + }, + plugins: [ + new ExtractTextPlugin('[name].[contenthash].css'), + // Make sure this is after ExtractTextPlugin! + new PurifyPlugin({ + // Give paths to parse for rules. These should be absolute! + paths: [ + path.join(__dirname, 'app/*.html') + ] + }) + ] +}; ``` And, that's it! Your scripts and view files will be scanned for classes, and those that are unused will be stripped off your CSS - aka. "purified". ## Options + This plugin, unlike the original PurifyCSS plugin, provides special features, such as scanning the dependency files and all kinds of files. To configure such behaviours, I will show you the options. | Property | Description @@ -77,3 +60,7 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | `resolveExtensions` | An array of extensions that should be given to PurifyCSS when determining classes. (defaults to webpack `resolve.extensions` config) | `paths` | An array of globs that reveal all your files. See [glob](http://npmjs.org/glob)'s documentation to see what kind of paths you can pass in this array. Use this array to pass files that won't be known to WebPack. | `purifyOptions` | Pass these options to PurifyCSS. See [here](https://github.com/purifycss/purifycss#the-optional-options-argument). Note: `output` is always `false`. + +## License + +ISC. From 65b6d1a52496a7309293b53fb0db6a4014456297 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 12:58:43 +0200 Subject: [PATCH 022/168] Update meta This works better as a scoped package. --- README.md | 8 ++++---- package.json | 12 ++++++------ 2 files changed, 10 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index 76d8ff9..dfea736 100644 --- a/README.md +++ b/README.md @@ -1,10 +1,10 @@ -# PurifyCSS WebPack Plugin (contrib fork) +# PurifyCSS WebPack Plugin - Community Version > **IMPORTANT: This is a friendly fork of [purifycss-webpack-plugin](https://github.com/purifycss/purifycss-webpack-plugin) with a slightly different API.** -This is a plugin for WebPack that utilizes [PurifyCSS](https://github.com/purifycss/purifycss) to clean your CSS. Its dead simple, but it requires you to be prepared. +This is a plugin for WebPack that utilizes [PurifyCSS](https://github.com/purifycss/purifycss) to clean your CSS. You **should** use the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin) with this. -You **should** use the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin) with this. Without any CSS file being emitted as an asset, this plugin will not do a thing except idle about inside the compiler. You can also use the `file` plugin to drop a special CSS file into your output folder, but it is highly recommend the extract plugin. +Without any CSS file being emitted as an asset, this plugin will not do a thing except idle about inside the compiler. You can also use the `file` plugin to drop a special CSS file into your output folder, but it is highly recommend these two plugins together. ## Usage @@ -19,7 +19,7 @@ The configure as follows: ```javascript const path = require('path'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); -const PurifyPlugin = require('purify-webpack-plugin'); +const PurifyPlugin = require('@webpack-contrib/purifycss-webpack-plugin'); module.exports = { entry: {...}, diff --git a/package.json b/package.json index ce5693e..b265fcc 100644 --- a/package.json +++ b/package.json @@ -1,14 +1,14 @@ { - "name": "purify-webpack-plugin", - "version": "2.0.3", - "description": "Unofficial PurifyCSS plugin for webpack", + "name": "@webpack-contrib/purifycss-webpack-plugin", + "version": "0.0.0", + "description": "Community maintained PurifyCSS plugin for webpack", "main": "index.js", "scripts": { "test": "echo \"No test suite for this version, yet.\" && exit 0" }, "repository": { "type": "git", - "url": "https://github.com/webpack-contrib/purify-webpack-plugin.git" + "url": "https://github.com/webpack-contrib/purifycss-webpack-plugin.git" }, "keywords": [ "webpack", @@ -19,9 +19,9 @@ "author": "Kenny Tran, Matthew Rourke, Phoebe Li, Kevin \"Ingwie Phoenix\" Ingwersen", "license": "ISC", "bugs": { - "url": "https://github.com/webpack-contrib/purify-webpack-plugin/issues" + "url": "https://github.com/webpack-contrib/purifycss-webpack-plugin/issues" }, - "homepage": "https://github.com/webpack-contrib/purify-webpack-plugin", + "homepage": "https://github.com/webpack-contrib/purifycss-webpack-plugin", "peerDependencies": { "webpack": "^1.9.11 || ^2.1.0-beta.19 || ^2.2.0-rc.0" }, From 12b9945cf517298b1d1009e1deae1413e00c7933 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 12:59:23 +0200 Subject: [PATCH 023/168] Fix webpack naming --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index dfea736..459de72 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,8 @@ -# PurifyCSS WebPack Plugin - Community Version +# PurifyCSS Webpack Plugin - Community Version > **IMPORTANT: This is a friendly fork of [purifycss-webpack-plugin](https://github.com/purifycss/purifycss-webpack-plugin) with a slightly different API.** -This is a plugin for WebPack that utilizes [PurifyCSS](https://github.com/purifycss/purifycss) to clean your CSS. You **should** use the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin) with this. +This is a plugin for webpack that utilizes [PurifyCSS](https://github.com/purifycss/purifycss) to clean your CSS. You **should** use the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin) with this. Without any CSS file being emitted as an asset, this plugin will not do a thing except idle about inside the compiler. You can also use the `file` plugin to drop a special CSS file into your output folder, but it is highly recommend these two plugins together. From 0f8e18103bb7b531937b318ff5a7c6c3698b609b Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 13:00:08 +0200 Subject: [PATCH 024/168] Fix installation instructions --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 459de72..ab0e076 100644 --- a/README.md +++ b/README.md @@ -8,13 +8,13 @@ Without any CSS file being emitted as an asset, this plugin will not do a thing ## Usage -First, get it: +First, install it: ```bash -npm install purify-webpack-plugin --save +npm install @webpack-contrib/purifycss-webpack-plugin --save-dev ``` -The configure as follows: +Then configure as follows: ```javascript const path = require('path'); From e0dc4568295a9cd996b277c18d93f8aa2e6b9c86 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 13:16:10 +0200 Subject: [PATCH 025/168] Set up initial demo This way there's something to develop against. --- .gitignore | 2 ++ demo/README.md | 3 +++ demo/app/component.js | 8 +++++++ demo/app/index.js | 5 +++++ demo/app/main.css | 3 +++ demo/package.json | 14 ++++++++++++ demo/webpack.config.js | 26 +++++++++++++++++++++ demo/webpack.parts.js | 51 ++++++++++++++++++++++++++++++++++++++++++ 8 files changed, 112 insertions(+) create mode 100644 demo/README.md create mode 100644 demo/app/component.js create mode 100644 demo/app/index.js create mode 100644 demo/app/main.css create mode 100644 demo/package.json create mode 100644 demo/webpack.config.js create mode 100644 demo/webpack.parts.js diff --git a/.gitignore b/.gitignore index 552f221..b5bbc5e 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,4 @@ node_modules/ +build/ *.log + diff --git a/demo/README.md b/demo/README.md new file mode 100644 index 0000000..5d2544b --- /dev/null +++ b/demo/README.md @@ -0,0 +1,3 @@ +1. `npm install` +2. `npm run build` +3. Examine `./build` diff --git a/demo/app/component.js b/demo/app/component.js new file mode 100644 index 0000000..018812c --- /dev/null +++ b/demo/app/component.js @@ -0,0 +1,8 @@ +export default function () { + const element = document.createElement('h1'); + + element.className = 'pure-button'; + element.innerHTML = 'Hello world'; + + return element; +} \ No newline at end of file diff --git a/demo/app/index.js b/demo/app/index.js new file mode 100644 index 0000000..8f1cebd --- /dev/null +++ b/demo/app/index.js @@ -0,0 +1,5 @@ +import 'purecss'; +import './main.css'; +import component from './component.js'; + +document.body.appendChild(component()); diff --git a/demo/app/main.css b/demo/app/main.css new file mode 100644 index 0000000..9bee0f0 --- /dev/null +++ b/demo/app/main.css @@ -0,0 +1,3 @@ +body { + background: cornsilk; +} diff --git a/demo/package.json b/demo/package.json new file mode 100644 index 0000000..2a00488 --- /dev/null +++ b/demo/package.json @@ -0,0 +1,14 @@ +{ + "name": "demo", + "scripts": { + "build": "webpack" + }, + "devDependencies": { + "css-loader": "^0.26.1", + "extract-text-webpack-plugin": "^2.0.0-beta.4", + "purecss": "^0.6.2", + "style-loader": "^0.13.1", + "webpack": "^2.2.0-rc.3", + "webpack-merge": "^2.3.1" + } +} diff --git a/demo/webpack.config.js b/demo/webpack.config.js new file mode 100644 index 0000000..e6b0dbb --- /dev/null +++ b/demo/webpack.config.js @@ -0,0 +1,26 @@ +const path = require('path'); +const webpack = require('webpack'); +const merge = require('webpack-merge'); + +const parts = require('./webpack.parts'); + +const PATHS = { + app: path.join(__dirname, 'app'), + build: path.join(__dirname, 'build') +}; + +module.exports = function() { + return merge( + { + entry: { + app: PATHS.app + }, + output: { + path: PATHS.build, + filename: '[name].js' + } + }, + parts.extractCSS(), + parts.purifyCSS(PATHS.app) + ); +}; diff --git a/demo/webpack.parts.js b/demo/webpack.parts.js new file mode 100644 index 0000000..2a20d00 --- /dev/null +++ b/demo/webpack.parts.js @@ -0,0 +1,51 @@ +const webpack = require('webpack'); +const ExtractTextPlugin = require('extract-text-webpack-plugin'); +const PurifyCSSPlugin = require('../'); + +exports.extractCSS = function(paths) { + return { + module: { + rules: [ + // Extract CSS during build + { + test: /\.css$/, + // Restrict extraction process to the given + // paths. + include: paths, + + loader: ExtractTextPlugin.extract({ + fallbackLoader: 'style-loader', + loader: 'css-loader' + }) + } + ] + }, + plugins: [ + // Output extracted CSS to a file + new ExtractTextPlugin('[name].[contenthash].css') + ] + }; +}; + +exports.purifyCSS = function(paths) { + paths = Array.isArray(paths) ? paths : [paths]; + + return { + plugins: [ + new PurifyCSSPlugin({ + // Our paths are absolute so Purify needs patching + // against that to work. + basePath: '/', + + // `paths` is used to point PurifyCSS to files not + // visible to Webpack. This expects glob patterns so + // we adapt here. + paths: paths.map(path => `${path}/*`), + + // Walk through only html files within node_modules. It + // picks up .js files by default! + resolveExtensions: ['.html'] + }) + ] + }; +}; From 2727f51fcb2fad04218ea2a6d2e2edfd77760e98 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 13:36:29 +0200 Subject: [PATCH 026/168] Clean up interface --- README.md | 10 ++++------ demo/webpack.parts.js | 10 +++------- index.js | 36 +++++++++++++++++------------------- package.json | 1 - 4 files changed, 24 insertions(+), 33 deletions(-) diff --git a/README.md b/README.md index ab0e076..664b2bf 100644 --- a/README.md +++ b/README.md @@ -18,6 +18,7 @@ Then configure as follows: ```javascript const path = require('path'); +const glob = require('glob'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); const PurifyPlugin = require('@webpack-contrib/purifycss-webpack-plugin'); @@ -40,9 +41,7 @@ module.exports = { // Make sure this is after ExtractTextPlugin! new PurifyPlugin({ // Give paths to parse for rules. These should be absolute! - paths: [ - path.join(__dirname, 'app/*.html') - ] + paths: glob.sync('app/*.html'), }) ] }; @@ -56,10 +55,9 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | Property | Description |---------------------|------------ -| `basePath` | The path from which all the other paths will start. Required. | `resolveExtensions` | An array of extensions that should be given to PurifyCSS when determining classes. (defaults to webpack `resolve.extensions` config) -| `paths` | An array of globs that reveal all your files. See [glob](http://npmjs.org/glob)'s documentation to see what kind of paths you can pass in this array. Use this array to pass files that won't be known to WebPack. -| `purifyOptions` | Pass these options to PurifyCSS. See [here](https://github.com/purifycss/purifycss#the-optional-options-argument). Note: `output` is always `false`. +| `paths` | An array of paths to traverse. It can be a good idea [glob](http://npmjs.org/glob) these. This can be an object (` -> []`) too if you need more control. +| `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). ## License diff --git a/demo/webpack.parts.js b/demo/webpack.parts.js index 2a20d00..c076b2d 100644 --- a/demo/webpack.parts.js +++ b/demo/webpack.parts.js @@ -1,5 +1,6 @@ const webpack = require('webpack'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); +const glob = require('glob'); const PurifyCSSPlugin = require('../'); exports.extractCSS = function(paths) { @@ -33,14 +34,9 @@ exports.purifyCSS = function(paths) { return { plugins: [ new PurifyCSSPlugin({ - // Our paths are absolute so Purify needs patching - // against that to work. - basePath: '/', - // `paths` is used to point PurifyCSS to files not - // visible to Webpack. This expects glob patterns so - // we adapt here. - paths: paths.map(path => `${path}/*`), + // visible to webpack. This expects an array of individual paths. + paths: [].concat.apply([], paths.map(path => glob.sync(`${path}/*`))), // Walk through only html files within node_modules. It // picks up .js files by default! diff --git a/index.js b/index.js index a826a50..ea46b28 100644 --- a/index.js +++ b/index.js @@ -1,5 +1,4 @@ var purify = require("purify-css"); -var glob = require("glob").sync; var path = require("path"); var ConcatSource = require("webpack-sources").ConcatSource; @@ -14,39 +13,40 @@ module.exports.prototype.apply = function(compiler) { // Bind the plugin into this compilation. compiler.plugin("this-compilation", function(compilation) { - // WebPack options + // webpack options var wpOptions = compilation.compiler.options; - // Base path - self.basePath = self.userOptions.basePath || wpOptions.context || process.cwd(); + // Purify options self.purifyOptions = self.userOptions.purifyOptions || { minify: false, info: wpOptions.debug || false }; self.purifyOptions.output = false; + // Path/files to check. If none supplied, an empty array will do. + // This can be an object too (entry -> [paths]) self.paths = self.userOptions.paths || []; - // chunk entry files. If none suplied, assume there is only one chunk - self.entryPaths = self.userOptions.entryPaths; + // Additional extensions to scan for. This is kept minimal, for obvious reasons. // We are not opinionated... self.resolveExtensions = self.userOptions.resolveExtensions || compiler.options.resolve.extensions; - var files = self.paths.reduce(function(results, p) { - return results.concat(glob(path.join(self.basePath, p))); - }, []); + var files = self.paths; compilation.plugin("additional-assets", function(cb){ - // check if there is only one chunk or if there are no entryPaths provided - if (compilation.chunks.length === 1 || !self.userOptions.entryPaths) { + // check if there is only one chunk if array + if (compilation.chunks.length === 1 || Array.isArray(self.paths)) { // Look for additional JS/HTML stuff. for(var key in compilation.fileDependencies) { var file = compilation.fileDependencies[key]; var ext = path.extname(file); - if (self.resolveExtensions.indexOf(ext) > -1) files.push(file); + + if (self.resolveExtensions.indexOf(ext) > -1) { + files.push(file); + } } - // Look for purifyable CSs... + // Look for purifyable CSS... for(var key in compilation.assets) { if(/\.css$/i.test(key)) { // We found a CSS. So purify it. @@ -60,11 +60,9 @@ module.exports.prototype.apply = function(compiler) { compilation.chunks.forEach(function (chunk) { var key; - if (self.entryPaths[chunk.name]) { + if (self.paths[chunk.name]) { // extract html chunk files - var chunkFiles = self.entryPaths[chunk.name].reduce(function (results, p) { - return results.concat(glob(path.join(self.basePath, p))); - }, []); + var chunkFiles = self.paths[chunk.name]; // filter chunk modules for additional files to include ex. .js, .es6,... for (var j = 0; j < chunk.modules.length; j++) { @@ -74,7 +72,7 @@ module.exports.prototype.apply = function(compiler) { } } - // find css asset + // find CSS asset for (var i = 0; i < assets.length; i++){ if (assets[i].indexOf(chunk.name) > -1 && path.extname(assets[i]) === '.css') { key = assets[i]; @@ -109,4 +107,4 @@ module.exports.prototype.apply = function(compiler) { cb(); }); }); -} \ No newline at end of file +} diff --git a/package.json b/package.json index b265fcc..b5cbfff 100644 --- a/package.json +++ b/package.json @@ -26,7 +26,6 @@ "webpack": "^1.9.11 || ^2.1.0-beta.19 || ^2.2.0-rc.0" }, "dependencies": { - "glob": "^5.0.15", "webpack-sources": "^0.1.0", "purify-css": "^1.1.1" } From 82e30c93266b687337b272cf95f4d824c4d6ba3e Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 13:37:30 +0200 Subject: [PATCH 027/168] Add .editorconfig --- .editorconfig | 9 +++++++++ 1 file changed, 9 insertions(+) create mode 100644 .editorconfig diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..52494a4 --- /dev/null +++ b/.editorconfig @@ -0,0 +1,9 @@ +# editorconfig.org + +[*] +indent_style = space +indent_size = 2 +end_of_line = lf +charset = utf-8 +trim_trailing_whitespace = true +insert_final_newline = true From f28cf60ab916125481437a1be2d3780102e3a017 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 14:34:55 +0200 Subject: [PATCH 028/168] Lint and simplify project I ended up dropping the multi-entry feature for now. That would need a proper test case. --- .eslintignore | 2 + .eslintrc.js | 15 ++++ .gitignore | 1 + README.md | 2 +- demo/app/component.js | 2 +- demo/app/index.js | 2 +- demo/package.json | 3 +- demo/webpack.config.js | 27 +++--- demo/webpack.parts.js | 14 ++-- index.js | 182 +++++++++++++++++------------------------ package.json | 17 +++- 11 files changed, 135 insertions(+), 132 deletions(-) create mode 100644 .eslintignore create mode 100644 .eslintrc.js diff --git a/.eslintignore b/.eslintignore new file mode 100644 index 0000000..dd87e2d --- /dev/null +++ b/.eslintignore @@ -0,0 +1,2 @@ +node_modules +build diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..dbf2632 --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,15 @@ +module.exports = { + "extends": "airbnb", + "env": { + "browser": true, + "node": true + }, + "rules": { + "comma-dangle": ["error", "never"], // personal preference + "no-param-reassign": 0, // consider enabling this again + "no-underscore-dangle": 0, // implementation detail (_highlights etc.) + "no-use-before-define": 0, // personal preference + "no-console": 0, // Allow logging + "prefer-spread": 0 // Node 4 doesn't support it :( + } +}; diff --git a/.gitignore b/.gitignore index b5bbc5e..46292a0 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ node_modules/ build/ *.log +.eslintcache diff --git a/README.md b/README.md index 664b2bf..3d8c6bc 100644 --- a/README.md +++ b/README.md @@ -56,7 +56,7 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | Property | Description |---------------------|------------ | `resolveExtensions` | An array of extensions that should be given to PurifyCSS when determining classes. (defaults to webpack `resolve.extensions` config) -| `paths` | An array of paths to traverse. It can be a good idea [glob](http://npmjs.org/glob) these. This can be an object (` -> []`) too if you need more control. +| `paths` | An array of paths to traverse. It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). ## License diff --git a/demo/app/component.js b/demo/app/component.js index 018812c..54d7e41 100644 --- a/demo/app/component.js +++ b/demo/app/component.js @@ -5,4 +5,4 @@ export default function () { element.innerHTML = 'Hello world'; return element; -} \ No newline at end of file +} diff --git a/demo/app/index.js b/demo/app/index.js index 8f1cebd..960ad6b 100644 --- a/demo/app/index.js +++ b/demo/app/index.js @@ -1,5 +1,5 @@ import 'purecss'; import './main.css'; -import component from './component.js'; +import component from './component'; document.body.appendChild(component()); diff --git a/demo/package.json b/demo/package.json index 2a00488..ec562a5 100644 --- a/demo/package.json +++ b/demo/package.json @@ -3,9 +3,10 @@ "scripts": { "build": "webpack" }, - "devDependencies": { + "dependencies": { "css-loader": "^0.26.1", "extract-text-webpack-plugin": "^2.0.0-beta.4", + "glob": "^7.1.1", "purecss": "^0.6.2", "style-loader": "^0.13.1", "webpack": "^2.2.0-rc.3", diff --git a/demo/webpack.config.js b/demo/webpack.config.js index e6b0dbb..e0ed123 100644 --- a/demo/webpack.config.js +++ b/demo/webpack.config.js @@ -1,5 +1,4 @@ const path = require('path'); -const webpack = require('webpack'); const merge = require('webpack-merge'); const parts = require('./webpack.parts'); @@ -9,18 +8,16 @@ const PATHS = { build: path.join(__dirname, 'build') }; -module.exports = function() { - return merge( - { - entry: { - app: PATHS.app - }, - output: { - path: PATHS.build, - filename: '[name].js' - } +module.exports = merge( + { + entry: { + app: PATHS.app }, - parts.extractCSS(), - parts.purifyCSS(PATHS.app) - ); -}; + output: { + path: PATHS.build, + filename: '[name].js' + } + }, + parts.extractCSS(), + parts.purifyCSS(PATHS.app) +); diff --git a/demo/webpack.parts.js b/demo/webpack.parts.js index c076b2d..2bab7be 100644 --- a/demo/webpack.parts.js +++ b/demo/webpack.parts.js @@ -1,9 +1,8 @@ -const webpack = require('webpack'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); const glob = require('glob'); const PurifyCSSPlugin = require('../'); -exports.extractCSS = function(paths) { +exports.extractCSS = function extractCSS(paths) { return { module: { rules: [ @@ -28,15 +27,18 @@ exports.extractCSS = function(paths) { }; }; -exports.purifyCSS = function(paths) { - paths = Array.isArray(paths) ? paths : [paths]; - +exports.purifyCSS = function purifyCSS(paths) { return { plugins: [ new PurifyCSSPlugin({ // `paths` is used to point PurifyCSS to files not // visible to webpack. This expects an array of individual paths. - paths: [].concat.apply([], paths.map(path => glob.sync(`${path}/*`))), + paths: [].concat.apply( + [], + (Array.isArray(paths) ? paths : [paths]).map( + path => glob.sync(`${path}/*`) + ) + ), // Walk through only html files within node_modules. It // picks up .js files by default! diff --git a/index.js b/index.js index ea46b28..d986c07 100644 --- a/index.js +++ b/index.js @@ -1,110 +1,82 @@ -var purify = require("purify-css"); -var path = require("path"); -var ConcatSource = require("webpack-sources").ConcatSource; +const purify = require('purify-css'); +const path = require('path'); +const ConcatSource = require('webpack-sources').ConcatSource; module.exports = function PurifyPlugin(options) { - // Store the user's options - this.userOptions = options; -} - -module.exports.prototype.apply = function(compiler) { - // Keep a reference to self - var self = this; - - // Bind the plugin into this compilation. - compiler.plugin("this-compilation", function(compilation) { - // webpack options - var wpOptions = compilation.compiler.options; - - // Purify options - self.purifyOptions = self.userOptions.purifyOptions || { - minify: false, - info: wpOptions.debug || false - }; - self.purifyOptions.output = false; - - // Path/files to check. If none supplied, an empty array will do. - // This can be an object too (entry -> [paths]) - self.paths = self.userOptions.paths || []; - - // Additional extensions to scan for. This is kept minimal, for obvious reasons. - // We are not opinionated... - self.resolveExtensions = self.userOptions.resolveExtensions || compiler.options.resolve.extensions; - - var files = self.paths; - - compilation.plugin("additional-assets", function(cb){ - // check if there is only one chunk if array - if (compilation.chunks.length === 1 || Array.isArray(self.paths)) { - // Look for additional JS/HTML stuff. - for(var key in compilation.fileDependencies) { - var file = compilation.fileDependencies[key]; - var ext = path.extname(file); - - if (self.resolveExtensions.indexOf(ext) > -1) { - files.push(file); - } - } - - // Look for purifyable CSS... - for(var key in compilation.assets) { - if(/\.css$/i.test(key)) { - // We found a CSS. So purify it. - executePurification(files, key); - } - } - } else { - // multiple entry chunks - var assets = Object.keys(compilation.assets); - - compilation.chunks.forEach(function (chunk) { - var key; - - if (self.paths[chunk.name]) { - // extract html chunk files - var chunkFiles = self.paths[chunk.name]; - - // filter chunk modules for additional files to include ex. .js, .es6,... - for (var j = 0; j < chunk.modules.length; j++) { - var ext = path.extname(chunk.modules[j].resource); - if (self.resolveExtensions.indexOf(ext) > -1) { - chunkFiles.push(chunk.modules[j].resource); - } - } - - // find CSS asset - for (var i = 0; i < assets.length; i++){ - if (assets[i].indexOf(chunk.name) > -1 && path.extname(assets[i]) === '.css') { - key = assets[i]; - break; - } - } - - if (key) { - if (self.purifyOptions.info) { - console.log(chunk.name); - } - - executePurification(chunkFiles, key); - } else { - console.warn('No CSS for chunk: ' + chunk.name); - } - } else { - console.warn('No entryPath for chunk: ' + chunk.name); - } - }); - } - - function executePurification(files, key) { - var asset = compilation.assets[key]; - var css = asset.source(); - var newCss = new ConcatSource(); - - newCss.add(purify(files, css, self.purifyOptions)); - compilation.assets[key] = newCss; - } - - cb(); + // Store the user's options + this.userOptions = options; +}; + +module.exports.prototype.apply = function apply(compiler) { + // Keep a reference to self + const self = this; + + // Bind the plugin into this compilation. + compiler.plugin('this-compilation', (compilation) => { + // webpack options + const wpOptions = compilation.compiler.options; + + // Purify options + self.purifyOptions = self.userOptions.purifyOptions || { + minify: false, + info: wpOptions.debug || false + }; + self.purifyOptions.output = false; + + // An array of files to check. + self.paths = self.userOptions.paths || []; + + // Additional extensions to scan for. This is kept minimal. + self.resolveExtensions = ( + self.userOptions.resolveExtensions || compiler.options.resolve.extensions + ); + + const files = self.paths; + + compilation.plugin('additional-assets', (cb) => { + // Check only if there is one chunk and if paths are an array + if (compilation.chunks.length === 1 || Array.isArray(self.paths)) { + purifyCSS( + // Look for additional files + files.concat( + searchAdditionalFiles(compilation.fileDependencies, self.resolveExtensions) + ), + compilation.assets + ).forEach((o) => { + compilation.assets[o.key] = o.value; }); + } + + cb(); }); + }); +}; + +function searchAdditionalFiles(fileDependencies, resolveExtensions) { + return Object.keys(fileDependencies).map((key) => { + const file = fileDependencies[key]; + const ext = path.extname(file); + + if (resolveExtensions.indexOf(ext) >= -1) { + return file; + } + + return null; + }).filter(a => a); +} + +function purifyCSS(files, assets, purifyOptions) { + return Object.keys(assets).map((key) => { + if (/\.css$/i.test(key)) { + const asset = assets[key]; + const css = asset.source(); + const value = new ConcatSource(); + + value.add(purify(files, css, purifyOptions)); + + return { key, value }; + } + + return null; + }).filter(a => a); } diff --git a/package.json b/package.json index b5cbfff..a41d1cf 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,9 @@ "description": "Community maintained PurifyCSS plugin for webpack", "main": "index.js", "scripts": { - "test": "echo \"No test suite for this version, yet.\" && exit 0" + "test:all": "npm run test:lint", + "test": "echo \"No test suite for this version, yet.\" && exit 0", + "test:lint": "eslint . --ext .js --cache" }, "repository": { "type": "git", @@ -28,5 +30,16 @@ "dependencies": { "webpack-sources": "^0.1.0", "purify-css": "^1.1.1" - } + }, + "pre-push": [], + "devDependencies": { + "eslint": "^3.13.0", + "eslint-config-airbnb": "^14.0.0", + "eslint-plugin-import": "^2.2.0", + "eslint-plugin-jsx-a11y": "^3.0.2", + "git-prepush-hook": "^1.0.1" + }, + "pre-push": [ + "test:all" + ] } From a49970fc8a19846f446686e44f3719f1ce340166 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 18:50:02 +0200 Subject: [PATCH 029/168] Allow `paths` to be a string Closes #52. --- README.md | 2 +- index.js | 5 +++++ 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 3d8c6bc..2258026 100644 --- a/README.md +++ b/README.md @@ -56,7 +56,7 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | Property | Description |---------------------|------------ | `resolveExtensions` | An array of extensions that should be given to PurifyCSS when determining classes. (defaults to webpack `resolve.extensions` config) -| `paths` | An array of paths to traverse. It can be a good idea [glob](http://npmjs.org/glob) these. +| `paths` | An array of paths or a path to traverse. It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). ## License diff --git a/index.js b/index.js index d986c07..9c47f27 100644 --- a/index.js +++ b/index.js @@ -26,6 +26,11 @@ module.exports.prototype.apply = function apply(compiler) { // An array of files to check. self.paths = self.userOptions.paths || []; + // Convert possible string to an array + if (typeof self.paths === 'string') { + self.paths = [self.paths]; + } + // Additional extensions to scan for. This is kept minimal. self.resolveExtensions = ( self.userOptions.resolveExtensions || compiler.options.resolve.extensions From 5bc89074d2e20f0905e10802f7ace5b5a7f7b445 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 18:52:45 +0200 Subject: [PATCH 030/168] Fix additional files check Looks like I broke this earlier. These need some tests. --- index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.js b/index.js index 9c47f27..dccfa3c 100644 --- a/index.js +++ b/index.js @@ -62,7 +62,7 @@ function searchAdditionalFiles(fileDependencies, resolveExtensions) { const file = fileDependencies[key]; const ext = path.extname(file); - if (resolveExtensions.indexOf(ext) >= -1) { + if (resolveExtensions.indexOf(ext) >= 0) { return file; } From a61b68ead25ed0523813ca738d2b00b5717581a0 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 19:09:56 +0200 Subject: [PATCH 031/168] chore - Fix meta --- package.json | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index a41d1cf..eac73dd 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { - "name": "@webpack-contrib/purifycss-webpack-plugin", - "version": "0.0.0", - "description": "Community maintained PurifyCSS plugin for webpack", + "name": "purifycss-webpack-plugin", + "version": "2.0.3", + "description": "PurifyCSS plugin for webpack", "main": "index.js", "scripts": { "test:all": "npm run test:lint", @@ -31,7 +31,6 @@ "webpack-sources": "^0.1.0", "purify-css": "^1.1.1" }, - "pre-push": [], "devDependencies": { "eslint": "^3.13.0", "eslint-config-airbnb": "^14.0.0", From a19795376bb404f6fc6f24defcf7020e71d4edec Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 19:10:29 +0200 Subject: [PATCH 032/168] chore - Fix readme imports and description --- README.md | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 2258026..cfce997 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,4 @@ -# PurifyCSS Webpack Plugin - Community Version - -> **IMPORTANT: This is a friendly fork of [purifycss-webpack-plugin](https://github.com/purifycss/purifycss-webpack-plugin) with a slightly different API.** +# PurifyCSS Webpack Plugin This is a plugin for webpack that utilizes [PurifyCSS](https://github.com/purifycss/purifycss) to clean your CSS. You **should** use the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin) with this. @@ -11,7 +9,7 @@ Without any CSS file being emitted as an asset, this plugin will not do a thing First, install it: ```bash -npm install @webpack-contrib/purifycss-webpack-plugin --save-dev +npm install purifycss-webpack-plugin --save-dev ``` Then configure as follows: @@ -20,7 +18,7 @@ Then configure as follows: const path = require('path'); const glob = require('glob'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); -const PurifyPlugin = require('@webpack-contrib/purifycss-webpack-plugin'); +const PurifyPlugin = require('purifycss-webpack-plugin'); module.exports = { entry: {...}, From 3c6393e53a8b22a9a271c751ba968aa45a3d48bd Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 19:36:04 +0200 Subject: [PATCH 033/168] chore - Add another CSS rule to the demo Related to #62. --- demo/app/main.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/demo/app/main.css b/demo/app/main.css index 9bee0f0..b1645d6 100644 --- a/demo/app/main.css +++ b/demo/app/main.css @@ -1,3 +1,7 @@ body { background: cornsilk; } + +body div { + background-color: deepskyblue; +} From 760253e2ae14f7df2000113dca50a51701b27969 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 19:36:42 +0200 Subject: [PATCH 034/168] chore - Drop contenthash from the demo No need for that. Simpler without. --- demo/webpack.parts.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/demo/webpack.parts.js b/demo/webpack.parts.js index 2bab7be..478a988 100644 --- a/demo/webpack.parts.js +++ b/demo/webpack.parts.js @@ -22,7 +22,7 @@ exports.extractCSS = function extractCSS(paths) { }, plugins: [ // Output extracted CSS to a file - new ExtractTextPlugin('[name].[contenthash].css') + new ExtractTextPlugin('[name].css') ] }; }; From f32f0d0d210d7179f28a64f98a2f9cad5547f1fa Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 19:40:12 +0200 Subject: [PATCH 035/168] chore - Add issue template --- ISSUE_TEMPLATE.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 ISSUE_TEMPLATE.md diff --git a/ISSUE_TEMPLATE.md b/ISSUE_TEMPLATE.md new file mode 100644 index 0000000..0434854 --- /dev/null +++ b/ISSUE_TEMPLATE.md @@ -0,0 +1,5 @@ +1. Check the version of package you are using. If it's not the newest version, update and try again (see changelog while updating!). +2. If the issue is still there, write a minimal project showing the problem and expected output. +3. Link to the project and mention Node version and OS in your report. + +**IMPORTANT! You should use [Stack Overflow](https://stackoverflow.com/) for support related questions.** From d985479f4148647819bde90dabe840d3b7e2620c Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 9 Jan 2017 19:42:07 +0200 Subject: [PATCH 036/168] Add a stub for changelog --- CHANGELOG.md | 9 +++++++++ 1 file changed, 9 insertions(+) create mode 100644 CHANGELOG.md diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 0000000..53dc2f7 --- /dev/null +++ b/CHANGELOG.md @@ -0,0 +1,9 @@ +3.0.0 / 2017-XX-XX +================== + + * TODO + +2.0.3 / 2016-02-12 +================== + + * Last release without changelogs. From 019c00919b1bc118776d205868cb24ff59468565 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 10:25:27 +0200 Subject: [PATCH 037/168] Split up source so it's easier to work with --- index.js | 87 ---------------------------------- package.json | 2 +- src/index.js | 46 ++++++++++++++++++ src/parse.js | 25 ++++++++++ src/purify-css.js | 20 ++++++++ src/search-additional-files.js | 16 +++++++ 6 files changed, 108 insertions(+), 88 deletions(-) delete mode 100644 index.js create mode 100644 src/index.js create mode 100644 src/parse.js create mode 100644 src/purify-css.js create mode 100644 src/search-additional-files.js diff --git a/index.js b/index.js deleted file mode 100644 index dccfa3c..0000000 --- a/index.js +++ /dev/null @@ -1,87 +0,0 @@ -const purify = require('purify-css'); -const path = require('path'); -const ConcatSource = require('webpack-sources').ConcatSource; - -module.exports = function PurifyPlugin(options) { - // Store the user's options - this.userOptions = options; -}; - -module.exports.prototype.apply = function apply(compiler) { - // Keep a reference to self - const self = this; - - // Bind the plugin into this compilation. - compiler.plugin('this-compilation', (compilation) => { - // webpack options - const wpOptions = compilation.compiler.options; - - // Purify options - self.purifyOptions = self.userOptions.purifyOptions || { - minify: false, - info: wpOptions.debug || false - }; - self.purifyOptions.output = false; - - // An array of files to check. - self.paths = self.userOptions.paths || []; - - // Convert possible string to an array - if (typeof self.paths === 'string') { - self.paths = [self.paths]; - } - - // Additional extensions to scan for. This is kept minimal. - self.resolveExtensions = ( - self.userOptions.resolveExtensions || compiler.options.resolve.extensions - ); - - const files = self.paths; - - compilation.plugin('additional-assets', (cb) => { - // Check only if there is one chunk and if paths are an array - if (compilation.chunks.length === 1 || Array.isArray(self.paths)) { - purifyCSS( - // Look for additional files - files.concat( - searchAdditionalFiles(compilation.fileDependencies, self.resolveExtensions) - ), - compilation.assets - ).forEach((o) => { - compilation.assets[o.key] = o.value; - }); - } - - cb(); - }); - }); -}; - -function searchAdditionalFiles(fileDependencies, resolveExtensions) { - return Object.keys(fileDependencies).map((key) => { - const file = fileDependencies[key]; - const ext = path.extname(file); - - if (resolveExtensions.indexOf(ext) >= 0) { - return file; - } - - return null; - }).filter(a => a); -} - -function purifyCSS(files, assets, purifyOptions) { - return Object.keys(assets).map((key) => { - if (/\.css$/i.test(key)) { - const asset = assets[key]; - const css = asset.source(); - const value = new ConcatSource(); - - value.add(purify(files, css, purifyOptions)); - - return { key, value }; - } - - return null; - }).filter(a => a); -} diff --git a/package.json b/package.json index eac73dd..33e1e6d 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "purifycss-webpack-plugin", "version": "2.0.3", "description": "PurifyCSS plugin for webpack", - "main": "index.js", + "main": "./src", "scripts": { "test:all": "npm run test:lint", "test": "echo \"No test suite for this version, yet.\" && exit 0", diff --git a/src/index.js b/src/index.js new file mode 100644 index 0000000..d704a80 --- /dev/null +++ b/src/index.js @@ -0,0 +1,46 @@ +const searchAdditionalFiles = require('./search-additional-files'); +const parse = require('./parse'); +const purifyCSS = require('./purify-css'); + +module.exports = function PurifyPlugin(options) { + // Store the user's options + this.userOptions = options; +}; + +module.exports.prototype.apply = function apply(compiler) { + // Keep a reference to self + const self = this; + + // Bind the plugin into this compilation. + compiler.plugin('this-compilation', (compilation) => { + // webpack options + const wpOptions = compilation.compiler.options; + + self.purifyOptions = parse.options(self.userOptions.purifyOptions, wpOptions.debug); + self.paths = parse.paths(self.userOptions.paths); + + // Additional extensions to scan for. This is kept minimal. + self.resolveExtensions = ( + self.userOptions.resolveExtensions || compiler.options.resolve.extensions + ); + + const files = self.paths; + + compilation.plugin('additional-assets', (cb) => { + // Check only if there is one chunk and if paths are an array + if (compilation.chunks.length === 1 || Array.isArray(self.paths)) { + purifyCSS( + // Look for additional files + files.concat( + searchAdditionalFiles(compilation.fileDependencies, self.resolveExtensions) + ), + compilation.assets + ).forEach((o) => { + compilation.assets[o.key] = o.value; + }); + } + + cb(); + }); + }); +}; diff --git a/src/parse.js b/src/parse.js new file mode 100644 index 0000000..9768a99 --- /dev/null +++ b/src/parse.js @@ -0,0 +1,25 @@ +function parseOptions(options, debug) { + const ret = options || { + minify: false, + info: debug + }; + ret.output = false; + + return ret; +} + +function parsePaths(paths) { + const ret = paths || []; + + // Convert possible string to an array + if (typeof ret === 'string') { + return [ret]; + } + + return ret; +} + +module.exports = { + options: parseOptions, + paths: parsePaths +}; diff --git a/src/purify-css.js b/src/purify-css.js new file mode 100644 index 0000000..499bdf7 --- /dev/null +++ b/src/purify-css.js @@ -0,0 +1,20 @@ +const purify = require('purify-css'); +const ConcatSource = require('webpack-sources').ConcatSource; + +function purifyCSS(files, assets, purifyOptions) { + return Object.keys(assets).map((key) => { + if (/\.css$/i.test(key)) { + const asset = assets[key]; + const css = asset.source(); + const value = new ConcatSource(); + + value.add(purify(files, css, purifyOptions)); + + return { key, value }; + } + + return null; + }).filter(a => a); +} + +module.exports = purifyCSS; diff --git a/src/search-additional-files.js b/src/search-additional-files.js new file mode 100644 index 0000000..eb195b3 --- /dev/null +++ b/src/search-additional-files.js @@ -0,0 +1,16 @@ +const path = require('path'); + +function searchAdditionalFiles(fileDependencies, resolveExtensions) { + return Object.keys(fileDependencies).map((key) => { + const file = fileDependencies[key]; + const ext = path.extname(file); + + if (resolveExtensions.indexOf(ext) >= 0) { + return file; + } + + return null; + }).filter(a => a); +} + +module.exports = searchAdditionalFiles; From c26f11707c90cc6a2141c46f33181cd2ba131cb3 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 10:29:46 +0200 Subject: [PATCH 038/168] chore - Simplify further --- src/index.js | 25 ++++++++----------------- src/parse.js | 7 ++----- 2 files changed, 10 insertions(+), 22 deletions(-) diff --git a/src/index.js b/src/index.js index d704a80..8329dc3 100644 --- a/src/index.js +++ b/src/index.js @@ -8,33 +8,24 @@ module.exports = function PurifyPlugin(options) { }; module.exports.prototype.apply = function apply(compiler) { - // Keep a reference to self - const self = this; - - // Bind the plugin into this compilation. compiler.plugin('this-compilation', (compilation) => { - // webpack options - const wpOptions = compilation.compiler.options; - - self.purifyOptions = parse.options(self.userOptions.purifyOptions, wpOptions.debug); - self.paths = parse.paths(self.userOptions.paths); + const paths = parse.paths(this.userOptions.paths); // Additional extensions to scan for. This is kept minimal. - self.resolveExtensions = ( - self.userOptions.resolveExtensions || compiler.options.resolve.extensions + const resolveExtensions = ( + this.userOptions.resolveExtensions || compiler.options.resolve.extensions ); - const files = self.paths; - compilation.plugin('additional-assets', (cb) => { // Check only if there is one chunk and if paths are an array - if (compilation.chunks.length === 1 || Array.isArray(self.paths)) { + if (compilation.chunks.length === 1 || Array.isArray(paths)) { purifyCSS( // Look for additional files - files.concat( - searchAdditionalFiles(compilation.fileDependencies, self.resolveExtensions) + paths.concat( + searchAdditionalFiles(compilation.fileDependencies, resolveExtensions) ), - compilation.assets + compilation.assets, + parse.options(this.userOptions.purifyOptions) ).forEach((o) => { compilation.assets[o.key] = o.value; }); diff --git a/src/parse.js b/src/parse.js index 9768a99..a2e735c 100644 --- a/src/parse.js +++ b/src/parse.js @@ -1,8 +1,5 @@ -function parseOptions(options, debug) { - const ret = options || { - minify: false, - info: debug - }; +function parseOptions(options) { + const ret = options || { minify: false }; ret.output = false; return ret; From ed0f6063a57fad839b66f42a0452a34e5c99d812 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 10:31:11 +0200 Subject: [PATCH 039/168] chore - Drop prototype bit and this to simplify further --- src/index.js | 53 ++++++++++++++++++++++++++-------------------------- 1 file changed, 26 insertions(+), 27 deletions(-) diff --git a/src/index.js b/src/index.js index 8329dc3..a83a957 100644 --- a/src/index.js +++ b/src/index.js @@ -3,35 +3,34 @@ const parse = require('./parse'); const purifyCSS = require('./purify-css'); module.exports = function PurifyPlugin(options) { - // Store the user's options - this.userOptions = options; -}; + return { + apply(compiler) { + compiler.plugin('this-compilation', (compilation) => { + const paths = parse.paths(options.paths); -module.exports.prototype.apply = function apply(compiler) { - compiler.plugin('this-compilation', (compilation) => { - const paths = parse.paths(this.userOptions.paths); + // Additional extensions to scan for. This is kept minimal. + const resolveExtensions = ( + options.resolveExtensions || compiler.options.resolve.extensions + ); - // Additional extensions to scan for. This is kept minimal. - const resolveExtensions = ( - this.userOptions.resolveExtensions || compiler.options.resolve.extensions - ); + compilation.plugin('additional-assets', (cb) => { + // Check only if there is one chunk and if paths are an array + if (compilation.chunks.length === 1 || Array.isArray(paths)) { + purifyCSS( + // Look for additional files + paths.concat( + searchAdditionalFiles(compilation.fileDependencies, resolveExtensions) + ), + compilation.assets, + parse.options(options.purifyOptions) + ).forEach((o) => { + compilation.assets[o.key] = o.value; + }); + } - compilation.plugin('additional-assets', (cb) => { - // Check only if there is one chunk and if paths are an array - if (compilation.chunks.length === 1 || Array.isArray(paths)) { - purifyCSS( - // Look for additional files - paths.concat( - searchAdditionalFiles(compilation.fileDependencies, resolveExtensions) - ), - compilation.assets, - parse.options(this.userOptions.purifyOptions) - ).forEach((o) => { - compilation.assets[o.key] = o.value; + cb(); }); - } - - cb(); - }); - }); + }); + } + }; }; From cca5770b70e9ec7732c23ed35de892fc21d92356 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 10:57:50 +0200 Subject: [PATCH 040/168] chore - Generalize search --- src/index.js | 4 ++-- src/{search-additional-files.js => search.js} | 4 +++- 2 files changed, 5 insertions(+), 3 deletions(-) rename src/{search-additional-files.js => search.js} (84%) diff --git a/src/index.js b/src/index.js index a83a957..34cfceb 100644 --- a/src/index.js +++ b/src/index.js @@ -1,4 +1,4 @@ -const searchAdditionalFiles = require('./search-additional-files'); +const search = require('./search'); const parse = require('./parse'); const purifyCSS = require('./purify-css'); @@ -19,7 +19,7 @@ module.exports = function PurifyPlugin(options) { purifyCSS( // Look for additional files paths.concat( - searchAdditionalFiles(compilation.fileDependencies, resolveExtensions) + search.additionalFiles(compilation.fileDependencies, resolveExtensions) ), compilation.assets, parse.options(options.purifyOptions) diff --git a/src/search-additional-files.js b/src/search.js similarity index 84% rename from src/search-additional-files.js rename to src/search.js index eb195b3..a33eeb6 100644 --- a/src/search-additional-files.js +++ b/src/search.js @@ -13,4 +13,6 @@ function searchAdditionalFiles(fileDependencies, resolveExtensions) { }).filter(a => a); } -module.exports = searchAdditionalFiles; +module.exports = { + additionalFiles: searchAdditionalFiles +}; From 7f28032ff7e7104583f358a5f92bd7d897cc03dd Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 10:58:37 +0200 Subject: [PATCH 041/168] chore - Clean up naming --- src/index.js | 4 ++-- src/purify-css.js | 6 +++--- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/index.js b/src/index.js index 34cfceb..7093320 100644 --- a/src/index.js +++ b/src/index.js @@ -23,8 +23,8 @@ module.exports = function PurifyPlugin(options) { ), compilation.assets, parse.options(options.purifyOptions) - ).forEach((o) => { - compilation.assets[o.key] = o.value; + ).forEach(({ key, source }) => { + compilation.assets[key] = source; }); } diff --git a/src/purify-css.js b/src/purify-css.js index 499bdf7..57548d8 100644 --- a/src/purify-css.js +++ b/src/purify-css.js @@ -6,11 +6,11 @@ function purifyCSS(files, assets, purifyOptions) { if (/\.css$/i.test(key)) { const asset = assets[key]; const css = asset.source(); - const value = new ConcatSource(); + const source = new ConcatSource(); - value.add(purify(files, css, purifyOptions)); + source.add(purify(files, css, purifyOptions)); - return { key, value }; + return { key, source }; } return null; From 768bff5a1381f04448f9449d99ed10b1df0f2253 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 11:04:02 +0200 Subject: [PATCH 042/168] chore - Clean up processing logic --- src/index.js | 2 +- src/purify-css.js | 17 ++++++----------- src/search.js | 15 +++++++++------ 3 files changed, 16 insertions(+), 18 deletions(-) diff --git a/src/index.js b/src/index.js index 7093320..02e8977 100644 --- a/src/index.js +++ b/src/index.js @@ -21,7 +21,7 @@ module.exports = function PurifyPlugin(options) { paths.concat( search.additionalFiles(compilation.fileDependencies, resolveExtensions) ), - compilation.assets, + search.assets(compilation.assets, /\.css$/i), parse.options(options.purifyOptions) ).forEach(({ key, source }) => { compilation.assets[key] = source; diff --git a/src/purify-css.js b/src/purify-css.js index 57548d8..d676923 100644 --- a/src/purify-css.js +++ b/src/purify-css.js @@ -2,19 +2,14 @@ const purify = require('purify-css'); const ConcatSource = require('webpack-sources').ConcatSource; function purifyCSS(files, assets, purifyOptions) { - return Object.keys(assets).map((key) => { - if (/\.css$/i.test(key)) { - const asset = assets[key]; - const css = asset.source(); - const source = new ConcatSource(); + return assets.map(({ key, asset }) => { + const css = asset.source(); + const source = new ConcatSource(); - source.add(purify(files, css, purifyOptions)); + source.add(purify(files, css, purifyOptions)); - return { key, source }; - } - - return null; - }).filter(a => a); + return { key, source }; + }) } module.exports = purifyCSS; diff --git a/src/search.js b/src/search.js index a33eeb6..595defb 100644 --- a/src/search.js +++ b/src/search.js @@ -5,14 +5,17 @@ function searchAdditionalFiles(fileDependencies, resolveExtensions) { const file = fileDependencies[key]; const ext = path.extname(file); - if (resolveExtensions.indexOf(ext) >= 0) { - return file; - } - - return null; + return resolveExtensions.indexOf(ext) >= 0 && file; }).filter(a => a); } +function searchAssets(assets, pattern) { + return Object.keys(assets).map( + key => pattern.test(key) && { key, asset: assets[key] } + ).filter(a => a); +} + module.exports = { - additionalFiles: searchAdditionalFiles + additionalFiles: searchAdditionalFiles, + assets: searchAssets }; From e1417e9e15e2748220184897210692fb71d206d2 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 11:06:52 +0200 Subject: [PATCH 043/168] chore - Tidy up --- src/purify-css.js | 20 ++++++++------------ 1 file changed, 8 insertions(+), 12 deletions(-) diff --git a/src/purify-css.js b/src/purify-css.js index d676923..6db0b2e 100644 --- a/src/purify-css.js +++ b/src/purify-css.js @@ -1,15 +1,11 @@ const purify = require('purify-css'); const ConcatSource = require('webpack-sources').ConcatSource; -function purifyCSS(files, assets, purifyOptions) { - return assets.map(({ key, asset }) => { - const css = asset.source(); - const source = new ConcatSource(); - - source.add(purify(files, css, purifyOptions)); - - return { key, source }; - }) -} - -module.exports = purifyCSS; +module.exports = function purifyCSS(files, assets, purifyOptions) { + return assets.map(({ key, asset }) => ( + { + key, + source: new ConcatSource(purify(files, asset.source(), purifyOptions)) + } + )); +}; From d7311303e536ac60870036a72ba7cbc11be0fe6a Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 11:19:38 +0200 Subject: [PATCH 044/168] Update dependencies --- package.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index 33e1e6d..ce5bd67 100644 --- a/package.json +++ b/package.json @@ -28,11 +28,11 @@ "webpack": "^1.9.11 || ^2.1.0-beta.19 || ^2.2.0-rc.0" }, "dependencies": { - "webpack-sources": "^0.1.0", - "purify-css": "^1.1.1" + "webpack-sources": "^0.1.3", + "purify-css": "^1.1.9" }, "devDependencies": { - "eslint": "^3.13.0", + "eslint": "^3.13.1", "eslint-config-airbnb": "^14.0.0", "eslint-plugin-import": "^2.2.0", "eslint-plugin-jsx-a11y": "^3.0.2", From 72018efceaf97965ac0d71368ab4bd64e5d50fa6 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 15:01:23 +0200 Subject: [PATCH 045/168] chore - Expand demo so it's easier to test multichunk support --- demo/another/component.js | 8 ++++++++ demo/another/index.js | 5 +++++ demo/another/main.css | 7 +++++++ demo/webpack.config.js | 41 +++++++++++++++++++++++++++------------ 4 files changed, 49 insertions(+), 12 deletions(-) create mode 100644 demo/another/component.js create mode 100644 demo/another/index.js create mode 100644 demo/another/main.css diff --git a/demo/another/component.js b/demo/another/component.js new file mode 100644 index 0000000..0b155d0 --- /dev/null +++ b/demo/another/component.js @@ -0,0 +1,8 @@ +export default function () { + const element = document.createElement('h1'); + + element.className = 'pure-form'; + element.innerHTML = 'Hello world Again'; + + return element; +} diff --git a/demo/another/index.js b/demo/another/index.js new file mode 100644 index 0000000..960ad6b --- /dev/null +++ b/demo/another/index.js @@ -0,0 +1,5 @@ +import 'purecss'; +import './main.css'; +import component from './component'; + +document.body.appendChild(component()); diff --git a/demo/another/main.css b/demo/another/main.css new file mode 100644 index 0000000..b1645d6 --- /dev/null +++ b/demo/another/main.css @@ -0,0 +1,7 @@ +body { + background: cornsilk; +} + +body div { + background-color: deepskyblue; +} diff --git a/demo/webpack.config.js b/demo/webpack.config.js index e0ed123..e7f8729 100644 --- a/demo/webpack.config.js +++ b/demo/webpack.config.js @@ -5,19 +5,36 @@ const parts = require('./webpack.parts'); const PATHS = { app: path.join(__dirname, 'app'), + another: path.join(__dirname, 'another'), build: path.join(__dirname, 'build') }; -module.exports = merge( - { - entry: { - app: PATHS.app +module.exports = [ + merge( + { + entry: { + app: PATHS.app + }, + output: { + path: path.join(PATHS.build, 'first'), + filename: '[name].js' + } }, - output: { - path: PATHS.build, - filename: '[name].js' - } - }, - parts.extractCSS(), - parts.purifyCSS(PATHS.app) -); + parts.extractCSS(), + parts.purifyCSS(PATHS.app) + ), + merge( + { + entry: { + first: PATHS.app, + second: PATHS.another + }, + output: { + path: path.join(PATHS.build, 'second'), + filename: '[name].js' + } + }, + parts.extractCSS(), + parts.purifyCSS(PATHS.app) + ) +]; From a79760b0473ea2c1fd5e0dd14d11206af9b1105b Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 15:31:17 +0200 Subject: [PATCH 046/168] chore - Tidy up the demo --- demo/webpack.config.js | 11 +++++++++-- demo/webpack.parts.js | 26 +++++--------------------- 2 files changed, 14 insertions(+), 23 deletions(-) diff --git a/demo/webpack.config.js b/demo/webpack.config.js index e7f8729..2afc3e4 100644 --- a/demo/webpack.config.js +++ b/demo/webpack.config.js @@ -1,5 +1,6 @@ const path = require('path'); const merge = require('webpack-merge'); +const glob = require('glob'); const parts = require('./webpack.parts'); @@ -21,7 +22,10 @@ module.exports = [ } }, parts.extractCSS(), - parts.purifyCSS(PATHS.app) + parts.purifyCSS( + glob.sync(`${PATHS.app}/*`), + ['.html'] + ) ), merge( { @@ -35,6 +39,9 @@ module.exports = [ } }, parts.extractCSS(), - parts.purifyCSS(PATHS.app) + parts.purifyCSS({ + first: glob.sync(`${PATHS.app}/*`), + second: glob.sync(`${PATHS.another}/*`) + }, ['.html']) ) ]; diff --git a/demo/webpack.parts.js b/demo/webpack.parts.js index 478a988..b449c6a 100644 --- a/demo/webpack.parts.js +++ b/demo/webpack.parts.js @@ -1,18 +1,13 @@ const ExtractTextPlugin = require('extract-text-webpack-plugin'); -const glob = require('glob'); const PurifyCSSPlugin = require('../'); exports.extractCSS = function extractCSS(paths) { return { module: { rules: [ - // Extract CSS during build { test: /\.css$/, - // Restrict extraction process to the given - // paths. include: paths, - loader: ExtractTextPlugin.extract({ fallbackLoader: 'style-loader', loader: 'css-loader' @@ -21,29 +16,18 @@ exports.extractCSS = function extractCSS(paths) { ] }, plugins: [ - // Output extracted CSS to a file new ExtractTextPlugin('[name].css') ] }; }; -exports.purifyCSS = function purifyCSS(paths) { +exports.purifyCSS = function purifyCSS( + paths, + resolveExtensions +) { return { plugins: [ - new PurifyCSSPlugin({ - // `paths` is used to point PurifyCSS to files not - // visible to webpack. This expects an array of individual paths. - paths: [].concat.apply( - [], - (Array.isArray(paths) ? paths : [paths]).map( - path => glob.sync(`${path}/*`) - ) - ), - - // Walk through only html files within node_modules. It - // picks up .js files by default! - resolveExtensions: ['.html'] - }) + new PurifyCSSPlugin({ paths, resolveExtensions }) ] }; }; From 0c16bd82bd84a4dbe93671f49eb6067c2cb1993f Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 15:32:51 +0200 Subject: [PATCH 047/168] Generalize search a notch --- src/search.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/src/search.js b/src/search.js index 595defb..d9f81a0 100644 --- a/src/search.js +++ b/src/search.js @@ -1,8 +1,12 @@ const path = require('path'); -function searchAdditionalFiles(fileDependencies, resolveExtensions) { - return Object.keys(fileDependencies).map((key) => { - const file = fileDependencies[key]; +function searchAdditionalFiles( + modules, + resolveExtensions, + getter = a => a +) { + return Object.keys(modules).map((key) => { + const file = getter(modules[key]); const ext = path.extname(file); return resolveExtensions.indexOf(ext) >= 0 && file; From e8012c519b79a400dea58e6e4c6f26cff5b43842 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 17:57:00 +0200 Subject: [PATCH 048/168] Implement purify per entry Related to #51. --- README.md | 2 +- demo/another/component.js | 2 +- src/index.js | 17 ++++++++++++++++- 3 files changed, 18 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index cfce997..ac221f4 100644 --- a/README.md +++ b/README.md @@ -54,7 +54,7 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | Property | Description |---------------------|------------ | `resolveExtensions` | An array of extensions that should be given to PurifyCSS when determining classes. (defaults to webpack `resolve.extensions` config) -| `paths` | An array of paths or a path to traverse. It can be a good idea [glob](http://npmjs.org/glob) these. +| `paths` | An array of paths or a path to traverse. This also accepts an object (` -> `). It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). ## License diff --git a/demo/another/component.js b/demo/another/component.js index 0b155d0..859f06b 100644 --- a/demo/another/component.js +++ b/demo/another/component.js @@ -1,7 +1,7 @@ export default function () { const element = document.createElement('h1'); - element.className = 'pure-form'; + element.className = 'pure-table'; element.innerHTML = 'Hello world Again'; return element; diff --git a/src/index.js b/src/index.js index 02e8977..33b44ee 100644 --- a/src/index.js +++ b/src/index.js @@ -17,7 +17,6 @@ module.exports = function PurifyPlugin(options) { // Check only if there is one chunk and if paths are an array if (compilation.chunks.length === 1 || Array.isArray(paths)) { purifyCSS( - // Look for additional files paths.concat( search.additionalFiles(compilation.fileDependencies, resolveExtensions) ), @@ -26,6 +25,22 @@ module.exports = function PurifyPlugin(options) { ).forEach(({ key, source }) => { compilation.assets[key] = source; }); + } else { + compilation.chunks.forEach((chunk) => { + purifyCSS( + paths[chunk.name].concat( + search.additionalFiles( + chunk.modules, resolveExtensions, ({ resource }) => resource + ) + ), + search.assets(compilation.assets, /\.css$/i).filter( + ({ key }) => key.indexOf(chunk.name) >= 0 + ), + parse.options(options.purifyOptions) + ).forEach(({ key, source }) => { + compilation.assets[key] = source; + }); + }); } cb(); From 3dfa6b81a9370e06766cd14dc673b5c42427fbfc Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 10 Jan 2017 18:15:50 +0200 Subject: [PATCH 049/168] chore - Push processing to a separate file --- src/index.js | 52 +++++++++++++++++++------------------------------- src/process.js | 39 +++++++++++++++++++++++++++++++++++++ 2 files changed, 59 insertions(+), 32 deletions(-) create mode 100644 src/process.js diff --git a/src/index.js b/src/index.js index 33b44ee..c484fa1 100644 --- a/src/index.js +++ b/src/index.js @@ -1,47 +1,35 @@ -const search = require('./search'); const parse = require('./parse'); -const purifyCSS = require('./purify-css'); +const process = require('./process'); module.exports = function PurifyPlugin(options) { return { apply(compiler) { compiler.plugin('this-compilation', (compilation) => { const paths = parse.paths(options.paths); - - // Additional extensions to scan for. This is kept minimal. const resolveExtensions = ( options.resolveExtensions || compiler.options.resolve.extensions ); + const purifyOptions = parse.options(options.purifyOptions); compilation.plugin('additional-assets', (cb) => { - // Check only if there is one chunk and if paths are an array - if (compilation.chunks.length === 1 || Array.isArray(paths)) { - purifyCSS( - paths.concat( - search.additionalFiles(compilation.fileDependencies, resolveExtensions) - ), - search.assets(compilation.assets, /\.css$/i), - parse.options(options.purifyOptions) - ).forEach(({ key, source }) => { - compilation.assets[key] = source; - }); - } else { - compilation.chunks.forEach((chunk) => { - purifyCSS( - paths[chunk.name].concat( - search.additionalFiles( - chunk.modules, resolveExtensions, ({ resource }) => resource - ) - ), - search.assets(compilation.assets, /\.css$/i).filter( - ({ key }) => key.indexOf(chunk.name) >= 0 - ), - parse.options(options.purifyOptions) - ).forEach(({ key, source }) => { - compilation.assets[key] = source; - }); - }); - } + (compilation.chunks.length === 1 || Array.isArray(paths) ? + process.single({ + paths, + dependencies: compilation.fileDependencies, + resolveExtensions, + purifyOptions, + assets: compilation.assets + }) : + process.entries({ + paths, + chunks: compilation.chunks, + resolveExtensions, + purifyOptions, + assets: compilation.assets + }) + ).forEach(({ key, source }) => { + compilation.assets[key] = source; + }); cb(); }); diff --git a/src/process.js b/src/process.js new file mode 100644 index 0000000..c146330 --- /dev/null +++ b/src/process.js @@ -0,0 +1,39 @@ +const purifyCSS = require('./purify-css'); +const search = require('./search'); + +function processSingle({ + paths, dependencies, resolveExtensions, assets, purifyOptions +}) { + return purifyCSS( + paths.concat( + search.additionalFiles( + dependencies, resolveExtensions + ) + ), + search.assets(assets, /\.css$/i), + purifyOptions + ); +} + +function processEntries({ + paths, resolveExtensions, chunks, assets, purifyOptions +}) { + return [].concat.apply([], chunks.map(chunk => ( + purifyCSS( + paths[chunk.name].concat( + search.additionalFiles( + chunk.modules, resolveExtensions, ({ resource }) => resource + ) + ), + search.assets(assets, /\.css$/i).filter( + ({ key }) => key.indexOf(chunk.name) >= 0 + ), + purifyOptions + ) + ))); +} + +module.exports = { + single: processSingle, + entries: processEntries +}; From 3984603b196dc7a5db00bd2e4978d9135261b959 Mon Sep 17 00:00:00 2001 From: Artem Sapegin Date: Wed, 11 Jan 2017 11:10:09 +0100 Subject: [PATCH 050/168] docs: glob.sync returns relative paths --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index ac221f4..8991965 100644 --- a/README.md +++ b/README.md @@ -39,7 +39,7 @@ module.exports = { // Make sure this is after ExtractTextPlugin! new PurifyPlugin({ // Give paths to parse for rules. These should be absolute! - paths: glob.sync('app/*.html'), + paths: glob.sync(path.join(__dirname, 'app/*.html')), }) ] }; @@ -54,7 +54,7 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | Property | Description |---------------------|------------ | `resolveExtensions` | An array of extensions that should be given to PurifyCSS when determining classes. (defaults to webpack `resolve.extensions` config) -| `paths` | An array of paths or a path to traverse. This also accepts an object (` -> `). It can be a good idea [glob](http://npmjs.org/glob) these. +| `paths` | An array of absolute paths or a path to traverse. This also accepts an object (` -> `). It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). ## License From 96d47f82b59d120f722882de0ce72d5db4eeb8bb Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Wed, 11 Jan 2017 13:32:15 +0200 Subject: [PATCH 051/168] Add initial tests --- .eslintignore | 6 +++-- .eslintrc.js | 5 +++- .gitignore | 1 + .travis.yml | 9 +++++++ README.md | 2 ++ package.json | 13 ++++++---- src/index.js | 2 +- src/parse.js | 8 ------- src/process.js | 8 ++----- src/search.js | 25 ++++++++++---------- tests/test-parse.js | 20 ++++++++++++++++ tests/test-process.js | 11 +++++++++ tests/test-purify-css.js | 6 +++++ tests/test-search.js | 51 ++++++++++++++++++++++++++++++++++++++++ 14 files changed, 132 insertions(+), 35 deletions(-) create mode 100644 .travis.yml create mode 100644 tests/test-parse.js create mode 100644 tests/test-process.js create mode 100644 tests/test-purify-css.js create mode 100644 tests/test-search.js diff --git a/.eslintignore b/.eslintignore index dd87e2d..7538dad 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,2 +1,4 @@ -node_modules -build +node_modules/ +coverage/ +build/ + diff --git a/.eslintrc.js b/.eslintrc.js index dbf2632..d379389 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -2,9 +2,12 @@ module.exports = { "extends": "airbnb", "env": { "browser": true, - "node": true + "node": true, + "mocha": true }, "rules": { + "prefer-arrow-callback": 0, // mocha tests (recommendation) + "func-names": 0, // mocha tests (recommendation) "comma-dangle": ["error", "never"], // personal preference "no-param-reassign": 0, // consider enabling this again "no-underscore-dangle": 0, // implementation detail (_highlights etc.) diff --git a/.gitignore b/.gitignore index 46292a0..f234171 100644 --- a/.gitignore +++ b/.gitignore @@ -1,5 +1,6 @@ node_modules/ build/ +coverage/ *.log .eslintcache diff --git a/.travis.yml b/.travis.yml new file mode 100644 index 0000000..1e79a72 --- /dev/null +++ b/.travis.yml @@ -0,0 +1,9 @@ +language: node_js +node_js: + - "4" + - "5" + - "6" +script: + - npm run test:all +after_success: + - bash <(curl -s https://codecov.io/bash) diff --git a/README.md b/README.md index 8991965..1ce558e 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,5 @@ +[![build status](https://secure.travis-ci.org/webpack-contrib/purifycss-webpack-plugin.svg)](http://travis-ci.org/webpack-contrib/purifycss-webpack-plugin) [![bitHound Score](https://www.bithound.io/github/webpack-contrib/purifycss-webpack-plugin/badges/score.svg)](https://www.bithound.io/github/webpack-contrib/purifycss-webpack-plugin) [![codecov](https://codecov.io/gh/webpack-contrib/purifycss-webpack-plugin/branch/master/graph/badge.svg)](https://codecov.io/gh/webpack-contrib/purifycss-webpack-plugin) + # PurifyCSS Webpack Plugin This is a plugin for webpack that utilizes [PurifyCSS](https://github.com/purifycss/purifycss) to clean your CSS. You **should** use the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin) with this. diff --git a/package.json b/package.json index ce5bd67..7dda9fd 100644 --- a/package.json +++ b/package.json @@ -4,9 +4,12 @@ "description": "PurifyCSS plugin for webpack", "main": "./src", "scripts": { - "test:all": "npm run test:lint", - "test": "echo \"No test suite for this version, yet.\" && exit 0", - "test:lint": "eslint . --ext .js --cache" + "test:all": "npm run test:coverage && npm run test:lint", + "test": "mocha tests/test-*", + "test:watch": "mocha --watch tests/test-*", + "test:coverage": "istanbul cover node_modules/.bin/_mocha tests/test-*", + "test:lint": "eslint . --ext .js --cache", + "preversion": "npm run test:all" }, "repository": { "type": "git", @@ -36,7 +39,9 @@ "eslint-config-airbnb": "^14.0.0", "eslint-plugin-import": "^2.2.0", "eslint-plugin-jsx-a11y": "^3.0.2", - "git-prepush-hook": "^1.0.1" + "git-prepush-hook": "^1.0.1", + "istanbul": "^0.4.5", + "mocha": "^3.2.0" }, "pre-push": [ "test:all" diff --git a/src/index.js b/src/index.js index c484fa1..9fb92ab 100644 --- a/src/index.js +++ b/src/index.js @@ -9,7 +9,7 @@ module.exports = function PurifyPlugin(options) { const resolveExtensions = ( options.resolveExtensions || compiler.options.resolve.extensions ); - const purifyOptions = parse.options(options.purifyOptions); + const purifyOptions = options.purifyOptions; compilation.plugin('additional-assets', (cb) => { (compilation.chunks.length === 1 || Array.isArray(paths) ? diff --git a/src/parse.js b/src/parse.js index a2e735c..e3e536c 100644 --- a/src/parse.js +++ b/src/parse.js @@ -1,10 +1,3 @@ -function parseOptions(options) { - const ret = options || { minify: false }; - ret.output = false; - - return ret; -} - function parsePaths(paths) { const ret = paths || []; @@ -17,6 +10,5 @@ function parsePaths(paths) { } module.exports = { - options: parseOptions, paths: parsePaths }; diff --git a/src/process.js b/src/process.js index c146330..8589d32 100644 --- a/src/process.js +++ b/src/process.js @@ -6,9 +6,7 @@ function processSingle({ }) { return purifyCSS( paths.concat( - search.additionalFiles( - dependencies, resolveExtensions - ) + search.files(dependencies, resolveExtensions) ), search.assets(assets, /\.css$/i), purifyOptions @@ -21,9 +19,7 @@ function processEntries({ return [].concat.apply([], chunks.map(chunk => ( purifyCSS( paths[chunk.name].concat( - search.additionalFiles( - chunk.modules, resolveExtensions, ({ resource }) => resource - ) + search.files(chunk.modules, resolveExtensions, ({ resource }) => resource) ), search.assets(assets, /\.css$/i).filter( ({ key }) => key.indexOf(chunk.name) >= 0 diff --git a/src/search.js b/src/search.js index d9f81a0..ccd38a0 100644 --- a/src/search.js +++ b/src/search.js @@ -1,25 +1,24 @@ const path = require('path'); -function searchAdditionalFiles( - modules, - resolveExtensions, +function searchAssets(assets = [], pattern) { + return Object.keys(assets).map( + key => pattern.test(key) && { key, asset: assets[key] } + ).filter(a => a); +} + +function searchFiles( + modules = {}, + extensions = [], getter = a => a ) { return Object.keys(modules).map((key) => { const file = getter(modules[key]); - const ext = path.extname(file); - return resolveExtensions.indexOf(ext) >= 0 && file; + return extensions.indexOf(path.extname(file)) >= 0 && file; }).filter(a => a); } -function searchAssets(assets, pattern) { - return Object.keys(assets).map( - key => pattern.test(key) && { key, asset: assets[key] } - ).filter(a => a); -} - module.exports = { - additionalFiles: searchAdditionalFiles, - assets: searchAssets + assets: searchAssets, + files: searchFiles }; diff --git a/tests/test-parse.js b/tests/test-parse.js new file mode 100644 index 0000000..dd146c5 --- /dev/null +++ b/tests/test-parse.js @@ -0,0 +1,20 @@ +const assert = require('assert'); +const parse = require('../src/parse'); + +describe('Parse paths', function () { + it('returns an empty array by default', function () { + assert.deepEqual(parse.paths(), []); + }); + + it('returns an object as itself', function () { + const o = { a: ['a', 'b', 'c'] }; + + assert.deepEqual(parse.paths(o), o); + }); + + it('puts a string inside an array', function () { + const str = 'foobar'; + + assert.deepEqual(parse.paths(str), [str]); + }); +}); diff --git a/tests/test-process.js b/tests/test-process.js new file mode 100644 index 0000000..26a56e4 --- /dev/null +++ b/tests/test-process.js @@ -0,0 +1,11 @@ +// const assert = require('assert'); +// const process = require('../src/process'); + +describe('Process single', function () { + // TODO +}); + +describe('Process entries', function () { + // TODO +}); + diff --git a/tests/test-purify-css.js b/tests/test-purify-css.js new file mode 100644 index 0000000..d44a900 --- /dev/null +++ b/tests/test-purify-css.js @@ -0,0 +1,6 @@ +// const assert = require('assert'); +// const purifyCSS = require('../src/purify-css'); + +describe('Purify CSS', function () { + // TODO +}); diff --git a/tests/test-search.js b/tests/test-search.js new file mode 100644 index 0000000..4aceb28 --- /dev/null +++ b/tests/test-search.js @@ -0,0 +1,51 @@ +const assert = require('assert'); +const search = require('../src/search'); + +describe('Search assets', function () { + it('returns nothing if nothing is passed', function () { + assert.deepEqual(search.assets(), []); + }); + + it('returns matches based on a pattern', function () { + const modules = { + 'foobar.txt': {}, + 'barbar.css': {} + }; + const pattern = /\.txt$/i; + const matches = [{ key: 'foobar.txt', asset: {} }]; + + assert.deepEqual(search.assets(modules, pattern), matches); + }); +}); + +describe('Search files', function () { + it('returns nothing if nothing is passed', function () { + assert.deepEqual(search.files(), []); + }); + + it('returns matches based on extension', function () { + const modules = ['foobar.txt', 'barbar.css']; + const extensions = ['.txt']; + const matches = ['foobar.txt']; + + assert.deepEqual(search.files(modules, extensions), matches); + }); + + it('returns matches based on extension with a customized getter', function () { + const modules = { + foobar: { + resource: 'foobar.txt' + }, + barbar: { + resource: 'barbar.css' + } + }; + const extensions = ['.txt']; + const matches = ['foobar.txt']; + + assert.deepEqual( + search.files(modules, extensions, ({ resource }) => resource), + matches + ); + }); +}); From b60e0e8c4fc4e51baa23c3fc09b1c14bcb1ef571 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Wed, 11 Jan 2017 14:35:07 +0200 Subject: [PATCH 052/168] breaking - resolveExtensions -> extensions A notch simpler this way. --- README.md | 2 +- demo/webpack.parts.js | 4 ++-- src/index.js | 8 ++++---- src/process.js | 8 ++++---- 4 files changed, 11 insertions(+), 11 deletions(-) diff --git a/README.md b/README.md index 1ce558e..9a6da8f 100644 --- a/README.md +++ b/README.md @@ -55,7 +55,7 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | Property | Description |---------------------|------------ -| `resolveExtensions` | An array of extensions that should be given to PurifyCSS when determining classes. (defaults to webpack `resolve.extensions` config) +| `extensions` | An array of extensions that should be given to PurifyCSS when determining classes. (defaults to webpack `resolve.extensions` config) | `paths` | An array of absolute paths or a path to traverse. This also accepts an object (` -> `). It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). diff --git a/demo/webpack.parts.js b/demo/webpack.parts.js index b449c6a..4b52200 100644 --- a/demo/webpack.parts.js +++ b/demo/webpack.parts.js @@ -23,11 +23,11 @@ exports.extractCSS = function extractCSS(paths) { exports.purifyCSS = function purifyCSS( paths, - resolveExtensions + extensions ) { return { plugins: [ - new PurifyCSSPlugin({ paths, resolveExtensions }) + new PurifyCSSPlugin({ paths, extensions }) ] }; }; diff --git a/src/index.js b/src/index.js index 9fb92ab..0496a36 100644 --- a/src/index.js +++ b/src/index.js @@ -6,8 +6,8 @@ module.exports = function PurifyPlugin(options) { apply(compiler) { compiler.plugin('this-compilation', (compilation) => { const paths = parse.paths(options.paths); - const resolveExtensions = ( - options.resolveExtensions || compiler.options.resolve.extensions + const extensions = ( + options.extensions || compiler.options.resolve.extensions ); const purifyOptions = options.purifyOptions; @@ -16,14 +16,14 @@ module.exports = function PurifyPlugin(options) { process.single({ paths, dependencies: compilation.fileDependencies, - resolveExtensions, + extensions, purifyOptions, assets: compilation.assets }) : process.entries({ paths, chunks: compilation.chunks, - resolveExtensions, + extensions, purifyOptions, assets: compilation.assets }) diff --git a/src/process.js b/src/process.js index 8589d32..d9dfec4 100644 --- a/src/process.js +++ b/src/process.js @@ -2,11 +2,11 @@ const purifyCSS = require('./purify-css'); const search = require('./search'); function processSingle({ - paths, dependencies, resolveExtensions, assets, purifyOptions + paths, dependencies, extensions, assets, purifyOptions }) { return purifyCSS( paths.concat( - search.files(dependencies, resolveExtensions) + search.files(dependencies, extensions) ), search.assets(assets, /\.css$/i), purifyOptions @@ -14,12 +14,12 @@ function processSingle({ } function processEntries({ - paths, resolveExtensions, chunks, assets, purifyOptions + paths, extensions, chunks, assets, purifyOptions }) { return [].concat.apply([], chunks.map(chunk => ( purifyCSS( paths[chunk.name].concat( - search.files(chunk.modules, resolveExtensions, ({ resource }) => resource) + search.files(chunk.modules, extensions, ({ resource }) => resource) ), search.assets(assets, /\.css$/i).filter( ({ key }) => key.indexOf(chunk.name) >= 0 From e393e8ccd25164d690452572d1d1ac24e1d774e1 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Wed, 11 Jan 2017 14:39:40 +0200 Subject: [PATCH 053/168] Improve documentation --- README.md | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 9a6da8f..ba2860d 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@ # PurifyCSS Webpack Plugin -This is a plugin for webpack that utilizes [PurifyCSS](https://github.com/purifycss/purifycss) to clean your CSS. You **should** use the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin) with this. +This is a plugin uses [PurifyCSS](https://github.com/purifycss/purifycss) to clean your CSS. You **should** use the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin) with this. Without any CSS file being emitted as an asset, this plugin will not do a thing except idle about inside the compiler. You can also use the `file` plugin to drop a special CSS file into your output folder, but it is highly recommend these two plugins together. @@ -49,13 +49,15 @@ module.exports = { And, that's it! Your scripts and view files will be scanned for classes, and those that are unused will be stripped off your CSS - aka. "purified". +> You can pass an object (` -> []`) to `paths` if you want to control the behavior per entry. + ## Options -This plugin, unlike the original PurifyCSS plugin, provides special features, such as scanning the dependency files and all kinds of files. To configure such behaviours, I will show you the options. +This plugin, unlike the original PurifyCSS plugin, provides special features, such as scanning the dependency files. You can configure using the following fields: | Property | Description |---------------------|------------ -| `extensions` | An array of extensions that should be given to PurifyCSS when determining classes. (defaults to webpack `resolve.extensions` config) +| `extensions` | An array of extensions that should be given to PurifyCSS when determining classes. This defaults to webpack `resolve.extensions` configuration. | `paths` | An array of absolute paths or a path to traverse. This also accepts an object (` -> `). It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). From 9725289aed28cca5290f6055122125d703678fd3 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Wed, 11 Jan 2017 14:41:25 +0200 Subject: [PATCH 054/168] chore - Add eslint react plugin The airbnb preset needs this. --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index 7dda9fd..d0c3805 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,7 @@ "eslint-config-airbnb": "^14.0.0", "eslint-plugin-import": "^2.2.0", "eslint-plugin-jsx-a11y": "^3.0.2", + "eslint-plugin-react": "^6.9.0", "git-prepush-hook": "^1.0.1", "istanbul": "^0.4.5", "mocha": "^3.2.0" From 344397f56a4d26c525b8720ae9e9f7df5a9837ee Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Wed, 11 Jan 2017 14:45:14 +0200 Subject: [PATCH 055/168] chore(travis) - Install demo deps Less lint failures this way. --- .travis.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/.travis.yml b/.travis.yml index 1e79a72..7094bf1 100644 --- a/.travis.yml +++ b/.travis.yml @@ -4,6 +4,7 @@ node_js: - "5" - "6" script: + - (cd demo && npm i) - npm run test:all after_success: - bash <(curl -s https://codecov.io/bash) From a4d785f5325f36db6c85fe6abaf03c7037cccdfd Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Wed, 11 Jan 2017 14:49:23 +0200 Subject: [PATCH 056/168] chore - Write object destructuring out of the project Node 4 doesn't support that. --- src/process.js | 2 +- tests/test-search.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/process.js b/src/process.js index d9dfec4..d665eb0 100644 --- a/src/process.js +++ b/src/process.js @@ -19,7 +19,7 @@ function processEntries({ return [].concat.apply([], chunks.map(chunk => ( purifyCSS( paths[chunk.name].concat( - search.files(chunk.modules, extensions, ({ resource }) => resource) + search.files(chunk.modules, extensions, file => file.resource) ), search.assets(assets, /\.css$/i).filter( ({ key }) => key.indexOf(chunk.name) >= 0 diff --git a/tests/test-search.js b/tests/test-search.js index 4aceb28..41ce395 100644 --- a/tests/test-search.js +++ b/tests/test-search.js @@ -44,7 +44,7 @@ describe('Search files', function () { const matches = ['foobar.txt']; assert.deepEqual( - search.files(modules, extensions, ({ resource }) => resource), + search.files(modules, extensions, file => file.resource), matches ); }); From 29a60e0a1364ac467f392bebcc880d4b3218b935 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Wed, 11 Jan 2017 15:41:04 +0200 Subject: [PATCH 057/168] chore - Set up Babel and Jest Easier test setup + less problems with old Node. --- .babelrc | 9 +++++++ .eslintignore | 1 + .gitignore | 1 + {tests => __tests__}/test-parse.js | 0 {tests => __tests__}/test-process.js | 8 +++++-- {tests => __tests__}/test-purify-css.js | 4 +++- {tests => __tests__}/test-search.js | 0 package.json | 31 ++++++++++++++++++++----- 8 files changed, 45 insertions(+), 9 deletions(-) create mode 100644 .babelrc rename {tests => __tests__}/test-parse.js (100%) rename {tests => __tests__}/test-process.js (63%) rename {tests => __tests__}/test-purify-css.js (72%) rename {tests => __tests__}/test-search.js (100%) diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..f7fd45b --- /dev/null +++ b/.babelrc @@ -0,0 +1,9 @@ +{ + "presets": [ + "es2015" + ], + "plugins": [ + "syntax-object-rest-spread", + "transform-object-rest-spread" + ] +} diff --git a/.eslintignore b/.eslintignore index 7538dad..00f9ee5 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,4 +1,5 @@ node_modules/ coverage/ build/ +lib/ diff --git a/.gitignore b/.gitignore index f234171..2120e98 100644 --- a/.gitignore +++ b/.gitignore @@ -1,5 +1,6 @@ node_modules/ build/ +lib/ coverage/ *.log .eslintcache diff --git a/tests/test-parse.js b/__tests__/test-parse.js similarity index 100% rename from tests/test-parse.js rename to __tests__/test-parse.js diff --git a/tests/test-process.js b/__tests__/test-process.js similarity index 63% rename from tests/test-process.js rename to __tests__/test-process.js index 26a56e4..140b4fc 100644 --- a/tests/test-process.js +++ b/__tests__/test-process.js @@ -2,10 +2,14 @@ // const process = require('../src/process'); describe('Process single', function () { - // TODO + it('processes', function () { + // TODO + }); }); describe('Process entries', function () { - // TODO + it('processes', function () { + // TODO + }); }); diff --git a/tests/test-purify-css.js b/__tests__/test-purify-css.js similarity index 72% rename from tests/test-purify-css.js rename to __tests__/test-purify-css.js index d44a900..92ef47a 100644 --- a/tests/test-purify-css.js +++ b/__tests__/test-purify-css.js @@ -2,5 +2,7 @@ // const purifyCSS = require('../src/purify-css'); describe('Purify CSS', function () { - // TODO + it('purifies', function () { + // TODO + }); }); diff --git a/tests/test-search.js b/__tests__/test-search.js similarity index 100% rename from tests/test-search.js rename to __tests__/test-search.js diff --git a/package.json b/package.json index d0c3805..03c2ccd 100644 --- a/package.json +++ b/package.json @@ -4,12 +4,13 @@ "description": "PurifyCSS plugin for webpack", "main": "./src", "scripts": { + "build": "babel src -d lib", "test:all": "npm run test:coverage && npm run test:lint", - "test": "mocha tests/test-*", - "test:watch": "mocha --watch tests/test-*", - "test:coverage": "istanbul cover node_modules/.bin/_mocha tests/test-*", + "test": "jest --", + "test:coverage": "jest --coverage --", + "test:watch": "jest --watch --", "test:lint": "eslint . --ext .js --cache", - "preversion": "npm run test:all" + "preversion": "npm run test:all && npm run build && git commit --allow-empty -am \"Update dist\"" }, "repository": { "type": "git", @@ -21,6 +22,18 @@ "plugin", "purify" ], + "files": [ + "lib" + ], + "jest": { + "collectCoverage": true, + "moduleFileExtensions": [ + "js" + ], + "moduleDirectories": [ + "node_modules" + ] + }, "author": "Kenny Tran, Matthew Rourke, Phoebe Li, Kevin \"Ingwie Phoenix\" Ingwersen", "license": "ISC", "bugs": { @@ -35,14 +48,20 @@ "purify-css": "^1.1.9" }, "devDependencies": { + "babel-cli": "^6.18.0", + "babel-core": "^6.21.0", + "babel-eslint": "^7.1.1", + "babel-jest": "^18.0.0", + "babel-plugin-syntax-object-rest-spread": "^6.13.0", + "babel-plugin-transform-object-rest-spread": "^6.20.2", + "babel-preset-es2015": "^6.18.0", "eslint": "^3.13.1", "eslint-config-airbnb": "^14.0.0", "eslint-plugin-import": "^2.2.0", "eslint-plugin-jsx-a11y": "^3.0.2", "eslint-plugin-react": "^6.9.0", "git-prepush-hook": "^1.0.1", - "istanbul": "^0.4.5", - "mocha": "^3.2.0" + "jest": "^18.1.0" }, "pre-push": [ "test:all" From 2350a301d1ea507f7ce22f4feed5b499039d75fd Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 12 Jan 2017 15:28:21 +0200 Subject: [PATCH 058/168] chore - key -> name Cleaner this way. --- __tests__/test-search.js | 2 +- src/index.js | 4 ++-- src/process.js | 2 +- src/purify-css.js | 4 ++-- src/search.js | 6 +++--- 5 files changed, 9 insertions(+), 9 deletions(-) diff --git a/__tests__/test-search.js b/__tests__/test-search.js index 41ce395..054ebd4 100644 --- a/__tests__/test-search.js +++ b/__tests__/test-search.js @@ -12,7 +12,7 @@ describe('Search assets', function () { 'barbar.css': {} }; const pattern = /\.txt$/i; - const matches = [{ key: 'foobar.txt', asset: {} }]; + const matches = [{ name: 'foobar.txt', asset: {} }]; assert.deepEqual(search.assets(modules, pattern), matches); }); diff --git a/src/index.js b/src/index.js index 0496a36..9a8463f 100644 --- a/src/index.js +++ b/src/index.js @@ -27,8 +27,8 @@ module.exports = function PurifyPlugin(options) { purifyOptions, assets: compilation.assets }) - ).forEach(({ key, source }) => { - compilation.assets[key] = source; + ).forEach(({ name, source }) => { + compilation.assets[name] = source; }); cb(); diff --git a/src/process.js b/src/process.js index d665eb0..75746fb 100644 --- a/src/process.js +++ b/src/process.js @@ -22,7 +22,7 @@ function processEntries({ search.files(chunk.modules, extensions, file => file.resource) ), search.assets(assets, /\.css$/i).filter( - ({ key }) => key.indexOf(chunk.name) >= 0 + ({ name }) => name.indexOf(chunk.name) >= 0 ), purifyOptions ) diff --git a/src/purify-css.js b/src/purify-css.js index 6db0b2e..aa43878 100644 --- a/src/purify-css.js +++ b/src/purify-css.js @@ -2,9 +2,9 @@ const purify = require('purify-css'); const ConcatSource = require('webpack-sources').ConcatSource; module.exports = function purifyCSS(files, assets, purifyOptions) { - return assets.map(({ key, asset }) => ( + return assets.map(({ name, asset }) => ( { - key, + name, source: new ConcatSource(purify(files, asset.source(), purifyOptions)) } )); diff --git a/src/search.js b/src/search.js index ccd38a0..2f0318e 100644 --- a/src/search.js +++ b/src/search.js @@ -2,7 +2,7 @@ const path = require('path'); function searchAssets(assets = [], pattern) { return Object.keys(assets).map( - key => pattern.test(key) && { key, asset: assets[key] } + name => pattern.test(name) && { name, asset: assets[name] } ).filter(a => a); } @@ -11,8 +11,8 @@ function searchFiles( extensions = [], getter = a => a ) { - return Object.keys(modules).map((key) => { - const file = getter(modules[key]); + return Object.keys(modules).map((name) => { + const file = getter(modules[name]); return extensions.indexOf(path.extname(file)) >= 0 && file; }).filter(a => a); From 7fec77f42d8643a055c9269b25446a92674789b4 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 12 Jan 2017 15:48:45 +0200 Subject: [PATCH 059/168] chore - Eliminate redundant code --- __tests__/test-process.js | 6 ------ src/index.js | 16 +++++++++------- src/process.js | 13 ------------- 3 files changed, 9 insertions(+), 26 deletions(-) diff --git a/__tests__/test-process.js b/__tests__/test-process.js index 140b4fc..5b812c2 100644 --- a/__tests__/test-process.js +++ b/__tests__/test-process.js @@ -1,12 +1,6 @@ // const assert = require('assert'); // const process = require('../src/process'); -describe('Process single', function () { - it('processes', function () { - // TODO - }); -}); - describe('Process entries', function () { it('processes', function () { // TODO diff --git a/src/index.js b/src/index.js index 9a8463f..6d2bb0c 100644 --- a/src/index.js +++ b/src/index.js @@ -1,5 +1,7 @@ const parse = require('./parse'); +const purifyCSS = require('./purify-css'); const process = require('./process'); +const search = require('./search'); module.exports = function PurifyPlugin(options) { return { @@ -13,13 +15,13 @@ module.exports = function PurifyPlugin(options) { compilation.plugin('additional-assets', (cb) => { (compilation.chunks.length === 1 || Array.isArray(paths) ? - process.single({ - paths, - dependencies: compilation.fileDependencies, - extensions, - purifyOptions, - assets: compilation.assets - }) : + purifyCSS( + paths.concat( + search.files(compilation.fileDependencies, extensions) + ), + search.assets(compilation.assets, /\.css$/i), + purifyOptions + ) : process.entries({ paths, chunks: compilation.chunks, diff --git a/src/process.js b/src/process.js index 75746fb..9282f9e 100644 --- a/src/process.js +++ b/src/process.js @@ -1,18 +1,6 @@ const purifyCSS = require('./purify-css'); const search = require('./search'); -function processSingle({ - paths, dependencies, extensions, assets, purifyOptions -}) { - return purifyCSS( - paths.concat( - search.files(dependencies, extensions) - ), - search.assets(assets, /\.css$/i), - purifyOptions - ); -} - function processEntries({ paths, extensions, chunks, assets, purifyOptions }) { @@ -30,6 +18,5 @@ function processEntries({ } module.exports = { - single: processSingle, entries: processEntries }; From 1f678940f76c4ddb97057632b65129eb88d58b27 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 12 Jan 2017 15:55:56 +0200 Subject: [PATCH 060/168] chore - Simplify further --- src/index.js | 26 +++++++++++++++----------- src/process.js | 21 +++------------------ 2 files changed, 18 insertions(+), 29 deletions(-) diff --git a/src/index.js b/src/index.js index 6d2bb0c..02c0a69 100644 --- a/src/index.js +++ b/src/index.js @@ -14,23 +14,27 @@ module.exports = function PurifyPlugin(options) { const purifyOptions = options.purifyOptions; compilation.plugin('additional-assets', (cb) => { - (compilation.chunks.length === 1 || Array.isArray(paths) ? + const { assets, chunks, fileDependencies } = compilation; + + (chunks.length === 1 || Array.isArray(paths) ? purifyCSS( paths.concat( - search.files(compilation.fileDependencies, extensions) + search.files(fileDependencies, extensions) ), - search.assets(compilation.assets, /\.css$/i), + search.assets(assets, /\.css$/i), purifyOptions ) : - process.entries({ - paths, - chunks: compilation.chunks, - extensions, - purifyOptions, - assets: compilation.assets - }) + process(chunks, ({ name, modules }) => purifyCSS( + paths[name].concat( + search.files(modules, extensions, file => file.resource) + ), + search.assets(assets, /\.css$/i).filter( + asset => asset.name.indexOf(name) >= 0 + ), + purifyOptions + )) ).forEach(({ name, source }) => { - compilation.assets[name] = source; + assets[name] = source; }); cb(); diff --git a/src/process.js b/src/process.js index 9282f9e..7799959 100644 --- a/src/process.js +++ b/src/process.js @@ -1,22 +1,7 @@ -const purifyCSS = require('./purify-css'); const search = require('./search'); -function processEntries({ - paths, extensions, chunks, assets, purifyOptions -}) { - return [].concat.apply([], chunks.map(chunk => ( - purifyCSS( - paths[chunk.name].concat( - search.files(chunk.modules, extensions, file => file.resource) - ), - search.assets(assets, /\.css$/i).filter( - ({ name }) => name.indexOf(chunk.name) >= 0 - ), - purifyOptions - ) - ))); +function processEntries(chunks, process = chunk => chunk) { + return [].concat.apply([], chunks.map(process)); } -module.exports = { - entries: processEntries -}; +module.exports = processEntries; From ab938d6f4f16037afe535bfe5bd5174e39cb875e Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 12 Jan 2017 16:02:17 +0200 Subject: [PATCH 061/168] chore - Eliminate process module --- .eslintrc.js | 3 +-- __tests__/test-process.js | 9 --------- src/index.js | 19 ++++++++++--------- src/process.js | 7 ------- 4 files changed, 11 insertions(+), 27 deletions(-) delete mode 100644 __tests__/test-process.js delete mode 100644 src/process.js diff --git a/.eslintrc.js b/.eslintrc.js index d379389..69a69a1 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -12,7 +12,6 @@ module.exports = { "no-param-reassign": 0, // consider enabling this again "no-underscore-dangle": 0, // implementation detail (_highlights etc.) "no-use-before-define": 0, // personal preference - "no-console": 0, // Allow logging - "prefer-spread": 0 // Node 4 doesn't support it :( + "no-console": 0 // Allow logging } }; diff --git a/__tests__/test-process.js b/__tests__/test-process.js deleted file mode 100644 index 5b812c2..0000000 --- a/__tests__/test-process.js +++ /dev/null @@ -1,9 +0,0 @@ -// const assert = require('assert'); -// const process = require('../src/process'); - -describe('Process entries', function () { - it('processes', function () { - // TODO - }); -}); - diff --git a/src/index.js b/src/index.js index 02c0a69..3ff35b9 100644 --- a/src/index.js +++ b/src/index.js @@ -1,6 +1,5 @@ const parse = require('./parse'); const purifyCSS = require('./purify-css'); -const process = require('./process'); const search = require('./search'); module.exports = function PurifyPlugin(options) { @@ -24,14 +23,16 @@ module.exports = function PurifyPlugin(options) { search.assets(assets, /\.css$/i), purifyOptions ) : - process(chunks, ({ name, modules }) => purifyCSS( - paths[name].concat( - search.files(modules, extensions, file => file.resource) - ), - search.assets(assets, /\.css$/i).filter( - asset => asset.name.indexOf(name) >= 0 - ), - purifyOptions + [].concat(...chunks.map( + ({ name, modules }) => purifyCSS( + paths[name].concat( + search.files(modules, extensions, file => file.resource) + ), + search.assets(assets, /\.css$/i).filter( + asset => asset.name.indexOf(name) >= 0 + ), + purifyOptions + ) )) ).forEach(({ name, source }) => { assets[name] = source; diff --git a/src/process.js b/src/process.js deleted file mode 100644 index 7799959..0000000 --- a/src/process.js +++ /dev/null @@ -1,7 +0,0 @@ -const search = require('./search'); - -function processEntries(chunks, process = chunk => chunk) { - return [].concat.apply([], chunks.map(process)); -} - -module.exports = processEntries; From 8e03c37fcafec3baf5f278138f96ece4c16767fa Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 12 Jan 2017 16:06:58 +0200 Subject: [PATCH 062/168] chore - Push purify logic to main This is good enough. Ideally this would be tested, though. --- __tests__/test-purify-css.js | 8 -------- src/index.js | 12 +++++++++++- src/purify-css.js | 11 ----------- 3 files changed, 11 insertions(+), 20 deletions(-) delete mode 100644 __tests__/test-purify-css.js delete mode 100644 src/purify-css.js diff --git a/__tests__/test-purify-css.js b/__tests__/test-purify-css.js deleted file mode 100644 index 92ef47a..0000000 --- a/__tests__/test-purify-css.js +++ /dev/null @@ -1,8 +0,0 @@ -// const assert = require('assert'); -// const purifyCSS = require('../src/purify-css'); - -describe('Purify CSS', function () { - it('purifies', function () { - // TODO - }); -}); diff --git a/src/index.js b/src/index.js index 3ff35b9..6096fb0 100644 --- a/src/index.js +++ b/src/index.js @@ -1,5 +1,6 @@ +const purify = require('purify-css'); +const ConcatSource = require('webpack-sources').ConcatSource; const parse = require('./parse'); -const purifyCSS = require('./purify-css'); const search = require('./search'); module.exports = function PurifyPlugin(options) { @@ -44,3 +45,12 @@ module.exports = function PurifyPlugin(options) { } }; }; + +const purifyCSS = (files, assets, purifyOptions) => ( + assets.map(({ name, asset }) => ( + { + name, + source: new ConcatSource(purify(files, asset.source(), purifyOptions)) + } + )) +); diff --git a/src/purify-css.js b/src/purify-css.js deleted file mode 100644 index aa43878..0000000 --- a/src/purify-css.js +++ /dev/null @@ -1,11 +0,0 @@ -const purify = require('purify-css'); -const ConcatSource = require('webpack-sources').ConcatSource; - -module.exports = function purifyCSS(files, assets, purifyOptions) { - return assets.map(({ name, asset }) => ( - { - name, - source: new ConcatSource(purify(files, asset.source(), purifyOptions)) - } - )); -}; From d0608406a104f955c4191260a54254b6653e4d07 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 12 Jan 2017 16:22:13 +0200 Subject: [PATCH 063/168] Drop a code path Simpler this way. Even the single case can go through chunks. --- src/index.js | 29 ++++++++++------------------- 1 file changed, 10 insertions(+), 19 deletions(-) diff --git a/src/index.js b/src/index.js index 6096fb0..5f87974 100644 --- a/src/index.js +++ b/src/index.js @@ -14,28 +14,19 @@ module.exports = function PurifyPlugin(options) { const purifyOptions = options.purifyOptions; compilation.plugin('additional-assets', (cb) => { - const { assets, chunks, fileDependencies } = compilation; + const { assets, chunks } = compilation; - (chunks.length === 1 || Array.isArray(paths) ? - purifyCSS( - paths.concat( - search.files(fileDependencies, extensions) + [].concat(...chunks.map( + ({ name, modules }) => purifyCSS( + (paths[name] || paths).concat( + search.files(modules, extensions, file => file.resource) + ), + search.assets(assets, /\.css$/i).filter( + asset => asset.name.indexOf(name) >= 0 ), - search.assets(assets, /\.css$/i), purifyOptions - ) : - [].concat(...chunks.map( - ({ name, modules }) => purifyCSS( - paths[name].concat( - search.files(modules, extensions, file => file.resource) - ), - search.assets(assets, /\.css$/i).filter( - asset => asset.name.indexOf(name) >= 0 - ), - purifyOptions - ) - )) - ).forEach(({ name, source }) => { + ) + )).forEach(({ name, source }) => { assets[name] = source; }); From 0a8337d887cd141c6633692f4b464bb7162208c6 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 12 Jan 2017 16:25:02 +0200 Subject: [PATCH 064/168] Point package main to the generated version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 03c2ccd..22d16b5 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "purifycss-webpack-plugin", "version": "2.0.3", "description": "PurifyCSS plugin for webpack", - "main": "./src", + "main": "./lib", "scripts": { "build": "babel src -d lib", "test:all": "npm run test:coverage && npm run test:lint", From 00169987acccc779eac544d75e5e8b2a111c820e Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 12 Jan 2017 16:27:53 +0200 Subject: [PATCH 065/168] chore - Tidy up --- src/index.js | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/src/index.js b/src/index.js index 5f87974..01b6db8 100644 --- a/src/index.js +++ b/src/index.js @@ -14,20 +14,18 @@ module.exports = function PurifyPlugin(options) { const purifyOptions = options.purifyOptions; compilation.plugin('additional-assets', (cb) => { - const { assets, chunks } = compilation; - - [].concat(...chunks.map( + [].concat(...compilation.chunks.map( ({ name, modules }) => purifyCSS( (paths[name] || paths).concat( search.files(modules, extensions, file => file.resource) ), - search.assets(assets, /\.css$/i).filter( + search.assets(compilation.assets, /\.css$/i).filter( asset => asset.name.indexOf(name) >= 0 ), purifyOptions ) )).forEach(({ name, source }) => { - assets[name] = source; + compilation.assets[name] = source; }); cb(); From a174b721c830fdf9042628f26b45aaa3c4725304 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 12 Jan 2017 16:29:08 +0200 Subject: [PATCH 066/168] chore - Drop a redundant variable No need for this anymore. --- src/index.js | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/src/index.js b/src/index.js index 01b6db8..e7bcecf 100644 --- a/src/index.js +++ b/src/index.js @@ -8,10 +8,7 @@ module.exports = function PurifyPlugin(options) { apply(compiler) { compiler.plugin('this-compilation', (compilation) => { const paths = parse.paths(options.paths); - const extensions = ( - options.extensions || compiler.options.resolve.extensions - ); - const purifyOptions = options.purifyOptions; + const extensions = options.extensions || compiler.options.resolve.extensions; compilation.plugin('additional-assets', (cb) => { [].concat(...compilation.chunks.map( @@ -22,7 +19,7 @@ module.exports = function PurifyPlugin(options) { search.assets(compilation.assets, /\.css$/i).filter( asset => asset.name.indexOf(name) >= 0 ), - purifyOptions + options.purifyOptions ) )).forEach(({ name, source }) => { compilation.assets[name] = source; From eb3cddc5e88c3ad0ecbda2787ba40da2195a8ac4 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 12 Jan 2017 16:48:04 +0200 Subject: [PATCH 067/168] chore - Write the logic in a more compact form --- src/index.js | 33 ++++++++++++++------------------- 1 file changed, 14 insertions(+), 19 deletions(-) diff --git a/src/index.js b/src/index.js index e7bcecf..e27a518 100644 --- a/src/index.js +++ b/src/index.js @@ -12,18 +12,22 @@ module.exports = function PurifyPlugin(options) { compilation.plugin('additional-assets', (cb) => { [].concat(...compilation.chunks.map( - ({ name, modules }) => purifyCSS( - (paths[name] || paths).concat( - search.files(modules, extensions, file => file.resource) - ), + ({ name: chunkName, modules }) => ( search.assets(compilation.assets, /\.css$/i).filter( - asset => asset.name.indexOf(name) >= 0 - ), - options.purifyOptions + asset => asset.name.indexOf(chunkName) >= 0 + ).forEach(({ name, asset }) => { + compilation.assets[name] = new ConcatSource( + purify( + (paths[chunkName] || paths).concat( + search.files(modules, extensions, file => file.resource) + ), + asset.source(), + options.purifyOptions + ) + ); + }) ) - )).forEach(({ name, source }) => { - compilation.assets[name] = source; - }); + )); cb(); }); @@ -31,12 +35,3 @@ module.exports = function PurifyPlugin(options) { } }; }; - -const purifyCSS = (files, assets, purifyOptions) => ( - assets.map(({ name, asset }) => ( - { - name, - source: new ConcatSource(purify(files, asset.source(), purifyOptions)) - } - )) -); From a680b5610b059f98dea6f5e04801c2e9d3d631f7 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 13 Jan 2017 10:39:56 +0200 Subject: [PATCH 068/168] docs - Document `extensions better` Closes #55. --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index ba2860d..e5dbf4a 100644 --- a/README.md +++ b/README.md @@ -57,7 +57,7 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | Property | Description |---------------------|------------ -| `extensions` | An array of extensions that should be given to PurifyCSS when determining classes. This defaults to webpack `resolve.extensions` configuration. +| `extensions` | An array of extensions that should be given to PurifyCSS when determining classes. This defaults to webpack `resolve.extensions` configuration. Often it's a good idea to override this with `['.html']` so it won't traverse `node_modules` `.js` files. | `paths` | An array of absolute paths or a path to traverse. This also accepts an object (` -> `). It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). From 7d1fdbfdf560525b0c5d01c1a9cf4b51deb2641e Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Sun, 15 Jan 2017 12:15:30 +0200 Subject: [PATCH 069/168] demo -> examples --- {demo => examples}/README.md | 0 {demo => examples}/another/component.js | 0 {demo => examples}/another/index.js | 0 {demo => examples}/another/main.css | 0 {demo => examples}/app/component.js | 0 {demo => examples}/app/index.js | 0 {demo => examples}/app/main.css | 0 {demo => examples}/package.json | 2 +- {demo => examples}/webpack.config.js | 0 {demo => examples}/webpack.parts.js | 0 10 files changed, 1 insertion(+), 1 deletion(-) rename {demo => examples}/README.md (100%) rename {demo => examples}/another/component.js (100%) rename {demo => examples}/another/index.js (100%) rename {demo => examples}/another/main.css (100%) rename {demo => examples}/app/component.js (100%) rename {demo => examples}/app/index.js (100%) rename {demo => examples}/app/main.css (100%) rename {demo => examples}/package.json (92%) rename {demo => examples}/webpack.config.js (100%) rename {demo => examples}/webpack.parts.js (100%) diff --git a/demo/README.md b/examples/README.md similarity index 100% rename from demo/README.md rename to examples/README.md diff --git a/demo/another/component.js b/examples/another/component.js similarity index 100% rename from demo/another/component.js rename to examples/another/component.js diff --git a/demo/another/index.js b/examples/another/index.js similarity index 100% rename from demo/another/index.js rename to examples/another/index.js diff --git a/demo/another/main.css b/examples/another/main.css similarity index 100% rename from demo/another/main.css rename to examples/another/main.css diff --git a/demo/app/component.js b/examples/app/component.js similarity index 100% rename from demo/app/component.js rename to examples/app/component.js diff --git a/demo/app/index.js b/examples/app/index.js similarity index 100% rename from demo/app/index.js rename to examples/app/index.js diff --git a/demo/app/main.css b/examples/app/main.css similarity index 100% rename from demo/app/main.css rename to examples/app/main.css diff --git a/demo/package.json b/examples/package.json similarity index 92% rename from demo/package.json rename to examples/package.json index ec562a5..e2c1a35 100644 --- a/demo/package.json +++ b/examples/package.json @@ -1,5 +1,5 @@ { - "name": "demo", + "name": "examples", "scripts": { "build": "webpack" }, diff --git a/demo/webpack.config.js b/examples/webpack.config.js similarity index 100% rename from demo/webpack.config.js rename to examples/webpack.config.js diff --git a/demo/webpack.parts.js b/examples/webpack.parts.js similarity index 100% rename from demo/webpack.parts.js rename to examples/webpack.parts.js From 0fb554a9854b60615c9436789398fdd292c88bc6 Mon Sep 17 00:00:00 2001 From: Artem Sapegin Date: Sun, 15 Jan 2017 18:40:51 +0100 Subject: [PATCH 070/168] Relax webpack dependency range --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 22d16b5..18bd127 100644 --- a/package.json +++ b/package.json @@ -41,7 +41,7 @@ }, "homepage": "https://github.com/webpack-contrib/purifycss-webpack-plugin", "peerDependencies": { - "webpack": "^1.9.11 || ^2.1.0-beta.19 || ^2.2.0-rc.0" + "webpack": "^1.9 || 2 || ^2.1.0-beta || ^2.2.0-rc" }, "dependencies": { "webpack-sources": "^0.1.3", From 0e4607957d0575de97b981f3c0276dc75794d43c Mon Sep 17 00:00:00 2001 From: Artem Sapegin Date: Sun, 15 Jan 2017 19:14:20 +0100 Subject: [PATCH 071/168] docs - Clarify Readme --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index e5dbf4a..253a870 100644 --- a/README.md +++ b/README.md @@ -2,9 +2,9 @@ # PurifyCSS Webpack Plugin -This is a plugin uses [PurifyCSS](https://github.com/purifycss/purifycss) to clean your CSS. You **should** use the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin) with this. +This plugin uses [PurifyCSS](https://github.com/purifycss/purifycss) to remove unused selectors from your CSS. You **should** use it with the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin). -Without any CSS file being emitted as an asset, this plugin will not do a thing except idle about inside the compiler. You can also use the `file` plugin to drop a special CSS file into your output folder, but it is highly recommend these two plugins together. +Without any CSS file being emitted as an asset, this plugin will do nothing. You can also use the `file` plugin to drop a CSS file into your output folder, but it is highly recommended to use the PurifyCSS plugin with the Extract Text plugin. ## Usage From c9e9de44b5a93d1dc492f7163fbd0774c37fa160 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 16 Jan 2017 10:15:57 +0200 Subject: [PATCH 072/168] Note that sourcemaps are not supported --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index e5dbf4a..d91804e 100644 --- a/README.md +++ b/README.md @@ -61,6 +61,8 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | `paths` | An array of absolute paths or a path to traverse. This also accepts an object (` -> `). It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). +> *purifycss-webpack-plugin* does **not** emit sourcemaps even if you enable `sourceMap` option on loaders! + ## License ISC. From 716fc739e1845f270013bb10e1c71ebaf7d0d69e Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 16 Jan 2017 10:17:34 +0200 Subject: [PATCH 073/168] chore - Simplify code There was one more simplification to make. --- examples/webpack.parts.js | 2 +- src/index.js | 8 ++++++-- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/examples/webpack.parts.js b/examples/webpack.parts.js index 4b52200..4345d17 100644 --- a/examples/webpack.parts.js +++ b/examples/webpack.parts.js @@ -10,7 +10,7 @@ exports.extractCSS = function extractCSS(paths) { include: paths, loader: ExtractTextPlugin.extract({ fallbackLoader: 'style-loader', - loader: 'css-loader' + loader: 'css-loader?sourceMap' }) } ] diff --git a/src/index.js b/src/index.js index e27a518..7c9132b 100644 --- a/src/index.js +++ b/src/index.js @@ -11,11 +11,15 @@ module.exports = function PurifyPlugin(options) { const extensions = options.extensions || compiler.options.resolve.extensions; compilation.plugin('additional-assets', (cb) => { - [].concat(...compilation.chunks.map( + // Go through chunks and purify as configured + compilation.chunks.forEach( ({ name: chunkName, modules }) => ( + // Search for CSS assets to purify. search.assets(compilation.assets, /\.css$/i).filter( asset => asset.name.indexOf(chunkName) >= 0 ).forEach(({ name, asset }) => { + // Compile through Purify and attach to output. Note that this + // loses sourcemaps should there be any! compilation.assets[name] = new ConcatSource( purify( (paths[chunkName] || paths).concat( @@ -27,7 +31,7 @@ module.exports = function PurifyPlugin(options) { ); }) ) - )); + ); cb(); }); From ead19b0d2c41cf1b17452eab6a00c73a44f6dfd6 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 16 Jan 2017 10:24:55 +0200 Subject: [PATCH 074/168] Update dependencies --- examples/package.json | 4 ++-- package.json | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/examples/package.json b/examples/package.json index e2c1a35..5469eec 100644 --- a/examples/package.json +++ b/examples/package.json @@ -5,11 +5,11 @@ }, "dependencies": { "css-loader": "^0.26.1", - "extract-text-webpack-plugin": "^2.0.0-beta.4", + "extract-text-webpack-plugin": "^2.0.0-beta.5", "glob": "^7.1.1", "purecss": "^0.6.2", "style-loader": "^0.13.1", "webpack": "^2.2.0-rc.3", - "webpack-merge": "^2.3.1" + "webpack-merge": "^2.4.0" } } diff --git a/package.json b/package.json index 22d16b5..c8f8a35 100644 --- a/package.json +++ b/package.json @@ -44,7 +44,7 @@ "webpack": "^1.9.11 || ^2.1.0-beta.19 || ^2.2.0-rc.0" }, "dependencies": { - "webpack-sources": "^0.1.3", + "webpack-sources": "^0.1.4", "purify-css": "^1.1.9" }, "devDependencies": { From 99f65c1cf092c9b29eefb0bee51f9faba18b972b Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 16 Jan 2017 10:35:52 +0200 Subject: [PATCH 075/168] chore - Simplify eslint rules --- .eslintrc.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 69a69a1..6632937 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -6,12 +6,13 @@ module.exports = { "mocha": true }, "rules": { + "import/no-unresolved": 0, // fails at travis + "import/extensions": 0, // fails at travis "prefer-arrow-callback": 0, // mocha tests (recommendation) "func-names": 0, // mocha tests (recommendation) "comma-dangle": ["error", "never"], // personal preference - "no-param-reassign": 0, // consider enabling this again - "no-underscore-dangle": 0, // implementation detail (_highlights etc.) + "no-param-reassign": 0, // the plugin needs this (webpack design :( ) "no-use-before-define": 0, // personal preference - "no-console": 0 // Allow logging + "no-console": 0 // allow logging } }; From fad62ecd5aae1518147caab5942ce4ebc39bcb93 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 16 Jan 2017 10:38:27 +0200 Subject: [PATCH 076/168] travis - Fix path --- .travis.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.travis.yml b/.travis.yml index 7094bf1..a4a7f86 100644 --- a/.travis.yml +++ b/.travis.yml @@ -4,7 +4,7 @@ node_js: - "5" - "6" script: - - (cd demo && npm i) + - (cd examples && npm i) - npm run test:all after_success: - bash <(curl -s https://codecov.io/bash) From 718d7ee5a73e2837d6bb548ca20ff7e81844078b Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 16 Jan 2017 10:38:47 +0200 Subject: [PATCH 077/168] chore - Drop failing travis rules It was a path issue. --- .eslintrc.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 6632937..2c370f0 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -6,8 +6,6 @@ module.exports = { "mocha": true }, "rules": { - "import/no-unresolved": 0, // fails at travis - "import/extensions": 0, // fails at travis "prefer-arrow-callback": 0, // mocha tests (recommendation) "func-names": 0, // mocha tests (recommendation) "comma-dangle": ["error", "never"], // personal preference From 72066ce167c2d54d77133421ea6e40aa3b3d3d25 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 16 Jan 2017 10:42:14 +0200 Subject: [PATCH 078/168] chore - Build the project on travis --- .travis.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/.travis.yml b/.travis.yml index a4a7f86..33fce7f 100644 --- a/.travis.yml +++ b/.travis.yml @@ -5,6 +5,7 @@ node_js: - "6" script: - (cd examples && npm i) + - npm run build - npm run test:all after_success: - bash <(curl -s https://codecov.io/bash) From f8a6ec005988603d9a52cbd4ada4c2edf565f05b Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 16 Jan 2017 11:31:49 +0200 Subject: [PATCH 079/168] chore - Add info output to demo --- examples/webpack.config.js | 5 ++++- examples/webpack.parts.js | 5 +++-- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/examples/webpack.config.js b/examples/webpack.config.js index 2afc3e4..e1f7e26 100644 --- a/examples/webpack.config.js +++ b/examples/webpack.config.js @@ -24,7 +24,10 @@ module.exports = [ parts.extractCSS(), parts.purifyCSS( glob.sync(`${PATHS.app}/*`), - ['.html'] + ['.html'], + { + info: true + } ) ), merge( diff --git a/examples/webpack.parts.js b/examples/webpack.parts.js index 4345d17..8294284 100644 --- a/examples/webpack.parts.js +++ b/examples/webpack.parts.js @@ -23,11 +23,12 @@ exports.extractCSS = function extractCSS(paths) { exports.purifyCSS = function purifyCSS( paths, - extensions + extensions, + purifyOptions ) { return { plugins: [ - new PurifyCSSPlugin({ paths, extensions }) + new PurifyCSSPlugin({ paths, extensions, purifyOptions }) ] }; }; From f4357cfdeb7fdf151df1ca886aa12285f3c6a6a7 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 16 Jan 2017 11:33:21 +0200 Subject: [PATCH 080/168] chore - Tidy up demo --- examples/webpack.config.js | 19 +++++++++++-------- examples/webpack.parts.js | 8 ++------ 2 files changed, 13 insertions(+), 14 deletions(-) diff --git a/examples/webpack.config.js b/examples/webpack.config.js index e1f7e26..7feeb5b 100644 --- a/examples/webpack.config.js +++ b/examples/webpack.config.js @@ -22,13 +22,13 @@ module.exports = [ } }, parts.extractCSS(), - parts.purifyCSS( - glob.sync(`${PATHS.app}/*`), - ['.html'], - { + parts.purifyCSS({ + paths: glob.sync(`${PATHS.app}/*`), + extensions: ['.html'], + purifyOptions: { info: true } - ) + }) ), merge( { @@ -43,8 +43,11 @@ module.exports = [ }, parts.extractCSS(), parts.purifyCSS({ - first: glob.sync(`${PATHS.app}/*`), - second: glob.sync(`${PATHS.another}/*`) - }, ['.html']) + paths: { + first: glob.sync(`${PATHS.app}/*`), + second: glob.sync(`${PATHS.another}/*`) + }, + extensions: ['.html'] + }) ) ]; diff --git a/examples/webpack.parts.js b/examples/webpack.parts.js index 8294284..f905fd6 100644 --- a/examples/webpack.parts.js +++ b/examples/webpack.parts.js @@ -21,14 +21,10 @@ exports.extractCSS = function extractCSS(paths) { }; }; -exports.purifyCSS = function purifyCSS( - paths, - extensions, - purifyOptions -) { +exports.purifyCSS = function purifyCSS(options) { return { plugins: [ - new PurifyCSSPlugin({ paths, extensions, purifyOptions }) + new PurifyCSSPlugin(options) ] }; }; From f055bf8b431b1483870cc5897752253c1ee4b50d Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 23 Jan 2017 10:27:26 +0200 Subject: [PATCH 081/168] chore - Simplify eslint + Set up postinstall --- .eslintignore | 5 ----- .gitignore | 2 +- lib/post_install.js | 28 ++++++++++++++++++++++++++++ package.json | 11 ++++++----- 4 files changed, 35 insertions(+), 11 deletions(-) delete mode 100644 .eslintignore create mode 100644 lib/post_install.js diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index 00f9ee5..0000000 --- a/.eslintignore +++ /dev/null @@ -1,5 +0,0 @@ -node_modules/ -coverage/ -build/ -lib/ - diff --git a/.gitignore b/.gitignore index 2120e98..9d256f2 100644 --- a/.gitignore +++ b/.gitignore @@ -1,6 +1,6 @@ node_modules/ build/ -lib/ +dist/ coverage/ *.log .eslintcache diff --git a/lib/post_install.js b/lib/post_install.js new file mode 100644 index 0000000..2c4ee48 --- /dev/null +++ b/lib/post_install.js @@ -0,0 +1,28 @@ +/* eslint-disable */ +// adapted based on rackt/history (MIT) +// Node 0.10+ +var execSync = require('child_process').execSync; +var stat = require('fs').stat; + +// Node 0.10 check +if (!execSync) { + execSync = require('sync-exec'); +} + +function exec(command) { + execSync(command, { + stdio: [0, 1, 2] + }); +} + +stat('dist', function(error, stat) { + // Skip building on Travis + if (process.env.TRAVIS) { + return; + } + + if (error || !stat.isDirectory()) { + exec('npm i babel-cli babel-preset-es2015 babel-plugin-syntax-object-rest-spread babel-transform-syntax-object-rest-spread'); + exec('npm run build'); + } +}); diff --git a/package.json b/package.json index bc0c505..fbc27f0 100644 --- a/package.json +++ b/package.json @@ -2,15 +2,16 @@ "name": "purifycss-webpack-plugin", "version": "2.0.3", "description": "PurifyCSS plugin for webpack", - "main": "./lib", + "main": "./dist", "scripts": { - "build": "babel src -d lib", + "build": "babel src -d dist", "test:all": "npm run test:coverage && npm run test:lint", "test": "jest --", "test:coverage": "jest --coverage --", "test:watch": "jest --watch --", - "test:lint": "eslint . --ext .js --cache", - "preversion": "npm run test:all && npm run build && git commit --allow-empty -am \"Update dist\"" + "test:lint": "eslint . --ext .js --ignore-path .gitignore --cache", + "preversion": "npm run test:all && npm run build && git commit --allow-empty -am \"Update dist\"", + "postinstall": "node lib/post_install.js" }, "repository": { "type": "git", @@ -23,7 +24,7 @@ "purify" ], "files": [ - "lib" + "dist" ], "jest": { "collectCoverage": true, From 0d0ab8c91075f4394a509615098c615606dfb29a Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 23 Jan 2017 10:30:34 +0200 Subject: [PATCH 082/168] chore - Rename as purifycss-webpack Since the old name cannot be used (no release rights), better start anew. --- CHANGELOG.md | 6 +++++- README.md | 12 +++++++----- package.json | 12 ++++++------ 3 files changed, 18 insertions(+), 12 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 53dc2f7..572ca48 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,8 +1,12 @@ -3.0.0 / 2017-XX-XX +## purifycss-webpack + +0.1.0 / 2017-XX-XX ================== * TODO +## purifycss-webpack-plugin + 2.0.3 / 2016-02-12 ================== diff --git a/README.md b/README.md index 1f19047..c79c8d7 100644 --- a/README.md +++ b/README.md @@ -1,17 +1,19 @@ -[![build status](https://secure.travis-ci.org/webpack-contrib/purifycss-webpack-plugin.svg)](http://travis-ci.org/webpack-contrib/purifycss-webpack-plugin) [![bitHound Score](https://www.bithound.io/github/webpack-contrib/purifycss-webpack-plugin/badges/score.svg)](https://www.bithound.io/github/webpack-contrib/purifycss-webpack-plugin) [![codecov](https://codecov.io/gh/webpack-contrib/purifycss-webpack-plugin/branch/master/graph/badge.svg)](https://codecov.io/gh/webpack-contrib/purifycss-webpack-plugin) +[![build status](https://secure.travis-ci.org/webpack-contrib/purifycss-webpack.svg)](http://travis-ci.org/webpack-contrib/purifycss-webpack) [![bitHound Score](https://www.bithound.io/github/webpack-contrib/purifycss-webpack/badges/score.svg)](https://www.bithound.io/github/webpack-contrib/purifycss-webpack) [![codecov](https://codecov.io/gh/webpack-contrib/purifycss-webpack/branch/master/graph/badge.svg)](https://codecov.io/gh/webpack-contrib/purifycss-webpack) -# PurifyCSS Webpack Plugin +# PurifyCSS for Webpack This plugin uses [PurifyCSS](https://github.com/purifycss/purifycss) to remove unused selectors from your CSS. You **should** use it with the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin). Without any CSS file being emitted as an asset, this plugin will do nothing. You can also use the `file` plugin to drop a CSS file into your output folder, but it is highly recommended to use the PurifyCSS plugin with the Extract Text plugin. +> This plugin replaces earlier [purifycss-webpack-plugin](https://www.npmjs.com/package/purifycss-webpack-plugin) and it has a different API! + ## Usage First, install it: ```bash -npm install purifycss-webpack-plugin --save-dev +npm install purifycss-webpack --save-dev ``` Then configure as follows: @@ -20,7 +22,7 @@ Then configure as follows: const path = require('path'); const glob = require('glob'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); -const PurifyPlugin = require('purifycss-webpack-plugin'); +const PurifyPlugin = require('purifycss-webpack'); module.exports = { entry: {...}, @@ -61,7 +63,7 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | `paths` | An array of absolute paths or a path to traverse. This also accepts an object (` -> `). It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). -> *purifycss-webpack-plugin* does **not** emit sourcemaps even if you enable `sourceMap` option on loaders! +> The plugin does **not** emit sourcemaps even if you enable `sourceMap` option on loaders! ## License diff --git a/package.json b/package.json index fbc27f0..17167d7 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { - "name": "purifycss-webpack-plugin", - "version": "2.0.3", - "description": "PurifyCSS plugin for webpack", + "name": "purifycss-webpack", + "version": "0.0.0", + "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { "build": "babel src -d dist", @@ -15,7 +15,7 @@ }, "repository": { "type": "git", - "url": "https://github.com/webpack-contrib/purifycss-webpack-plugin.git" + "url": "https://github.com/webpack-contrib/purifycss-webpack.git" }, "keywords": [ "webpack", @@ -38,9 +38,9 @@ "author": "Kenny Tran, Matthew Rourke, Phoebe Li, Kevin \"Ingwie Phoenix\" Ingwersen", "license": "ISC", "bugs": { - "url": "https://github.com/webpack-contrib/purifycss-webpack-plugin/issues" + "url": "https://github.com/webpack-contrib/purifycss-webpack/issues" }, - "homepage": "https://github.com/webpack-contrib/purifycss-webpack-plugin", + "homepage": "https://github.com/webpack-contrib/purifycss-webpack", "peerDependencies": { "webpack": "^1.9 || 2 || ^2.1.0-beta || ^2.2.0-rc" }, From bc6264628083331ee894d0020ecf0e0a274b5b6f Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 23 Jan 2017 10:59:51 +0200 Subject: [PATCH 083/168] feat - Add `verbose` flag This is handy for getting more output from the compilation process. --- README.md | 1 + examples/webpack.config.js | 6 ++--- src/index.js | 53 ++++++++++++++++++++++++++++---------- 3 files changed, 43 insertions(+), 17 deletions(-) diff --git a/README.md b/README.md index c79c8d7..27416f6 100644 --- a/README.md +++ b/README.md @@ -62,6 +62,7 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | `extensions` | An array of extensions that should be given to PurifyCSS when determining classes. This defaults to webpack `resolve.extensions` configuration. Often it's a good idea to override this with `['.html']` so it won't traverse `node_modules` `.js` files. | `paths` | An array of absolute paths or a path to traverse. This also accepts an object (` -> `). It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). +| `verbose` | Set this flag to get verbose output from the plugin. This sets `purifyOptions.info`, but you can override `info` separately if you want less logging. > The plugin does **not** emit sourcemaps even if you enable `sourceMap` option on loaders! diff --git a/examples/webpack.config.js b/examples/webpack.config.js index 7feeb5b..7c2fdb9 100644 --- a/examples/webpack.config.js +++ b/examples/webpack.config.js @@ -23,11 +23,9 @@ module.exports = [ }, parts.extractCSS(), parts.purifyCSS({ + verbose: true, paths: glob.sync(`${PATHS.app}/*`), - extensions: ['.html'], - purifyOptions: { - info: true - } + extensions: ['.html'] }) ), merge( diff --git a/src/index.js b/src/index.js index 7c9132b..a5b838f 100644 --- a/src/index.js +++ b/src/index.js @@ -8,29 +8,56 @@ module.exports = function PurifyPlugin(options) { apply(compiler) { compiler.plugin('this-compilation', (compilation) => { const paths = parse.paths(options.paths); - const extensions = options.extensions || compiler.options.resolve.extensions; + const extensions = options.extensions || + compiler.options.resolve.extensions; + + // Output debug information through a callback pattern + // to avoid unnecessary processing + const output = options.verbose ? + messageCb => console.info(...messageCb()) : + () => {}; compilation.plugin('additional-assets', (cb) => { // Go through chunks and purify as configured compilation.chunks.forEach( - ({ name: chunkName, modules }) => ( - // Search for CSS assets to purify. - search.assets(compilation.assets, /\.css$/i).filter( + ({ name: chunkName, modules }) => { + const assetsToPurify = search.assets( + compilation.assets, /\.css$/i + ).filter( asset => asset.name.indexOf(chunkName) >= 0 - ).forEach(({ name, asset }) => { - // Compile through Purify and attach to output. Note that this - // loses sourcemaps should there be any! + ); + + output(() => [ + 'Assets to purify:', + assetsToPurify.map(({ name }) => name).join(', ') + ]); + + assetsToPurify.forEach(({ name, asset }) => { + const filesToSearch = (paths[chunkName] || paths).concat( + search.files( + modules, extensions, file => file.resource + ) + ); + + output(() => [ + 'Files to search for used rules:', + filesToSearch.join(', ') + ]); + + // Compile through Purify and attach to output. + // This loses sourcemaps should there be any! compilation.assets[name] = new ConcatSource( purify( - (paths[chunkName] || paths).concat( - search.files(modules, extensions, file => file.resource) - ), + filesToSearch, asset.source(), - options.purifyOptions + { + info: options.verbose, + ...options.purifyOptions + } ) ); - }) - ) + }); + } ); cb(); From 7c346fe9603d7291532078b6bf947782a8b2a591 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 23 Jan 2017 11:24:08 +0200 Subject: [PATCH 084/168] feat - Make extension setup more flexible Now it's clearer and there's more control. --- README.md | 5 +++-- __tests__/test-search.js | 4 ++-- examples/webpack.config.js | 4 ++-- src/index.js | 6 ++---- src/search.js | 7 +++++-- 5 files changed, 14 insertions(+), 12 deletions(-) diff --git a/README.md b/README.md index 27416f6..f9e000c 100644 --- a/README.md +++ b/README.md @@ -59,10 +59,11 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | Property | Description |---------------------|------------ -| `extensions` | An array of extensions that should be given to PurifyCSS when determining classes. This defaults to webpack `resolve.extensions` configuration. Often it's a good idea to override this with `['.html']` so it won't traverse `node_modules` `.js` files. +| `fileExtensions` | An array of file extensions for determining used classes. Defaults to `['.css']`. +| `moduleExtensions` | An array of file extensions for determining used classes within `node_modules`. Defaults to `[]`, but `['.html']` can be useful here. | `paths` | An array of absolute paths or a path to traverse. This also accepts an object (` -> `). It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). -| `verbose` | Set this flag to get verbose output from the plugin. This sets `purifyOptions.info`, but you can override `info` separately if you want less logging. +| `verbose` | Set this flag to get verbose output from the plugin. This sets `purifyOptions.info`, but you can override `info` separately if you want less logging. > The plugin does **not** emit sourcemaps even if you enable `sourceMap` option on loaders! diff --git a/__tests__/test-search.js b/__tests__/test-search.js index 054ebd4..37fd438 100644 --- a/__tests__/test-search.js +++ b/__tests__/test-search.js @@ -11,10 +11,10 @@ describe('Search assets', function () { 'foobar.txt': {}, 'barbar.css': {} }; - const pattern = /\.txt$/i; + const extensions = ['.txt']; const matches = [{ name: 'foobar.txt', asset: {} }]; - assert.deepEqual(search.assets(modules, pattern), matches); + assert.deepEqual(search.assets(modules, extensions), matches); }); }); diff --git a/examples/webpack.config.js b/examples/webpack.config.js index 7c2fdb9..98b2978 100644 --- a/examples/webpack.config.js +++ b/examples/webpack.config.js @@ -25,7 +25,7 @@ module.exports = [ parts.purifyCSS({ verbose: true, paths: glob.sync(`${PATHS.app}/*`), - extensions: ['.html'] + extensions: ['.css', '.html'] }) ), merge( @@ -45,7 +45,7 @@ module.exports = [ first: glob.sync(`${PATHS.app}/*`), second: glob.sync(`${PATHS.another}/*`) }, - extensions: ['.html'] + extensions: ['.css', '.html'] }) ) ]; diff --git a/src/index.js b/src/index.js index a5b838f..cd413df 100644 --- a/src/index.js +++ b/src/index.js @@ -8,8 +8,6 @@ module.exports = function PurifyPlugin(options) { apply(compiler) { compiler.plugin('this-compilation', (compilation) => { const paths = parse.paths(options.paths); - const extensions = options.extensions || - compiler.options.resolve.extensions; // Output debug information through a callback pattern // to avoid unnecessary processing @@ -22,7 +20,7 @@ module.exports = function PurifyPlugin(options) { compilation.chunks.forEach( ({ name: chunkName, modules }) => { const assetsToPurify = search.assets( - compilation.assets, /\.css$/i + compilation.assets, options.fileExtensions || ['.css'] ).filter( asset => asset.name.indexOf(chunkName) >= 0 ); @@ -35,7 +33,7 @@ module.exports = function PurifyPlugin(options) { assetsToPurify.forEach(({ name, asset }) => { const filesToSearch = (paths[chunkName] || paths).concat( search.files( - modules, extensions, file => file.resource + modules, options.moduleExtensions || [], file => file.resource ) ); diff --git a/src/search.js b/src/search.js index 2f0318e..9ebeff3 100644 --- a/src/search.js +++ b/src/search.js @@ -1,8 +1,11 @@ const path = require('path'); -function searchAssets(assets = [], pattern) { +function searchAssets( + assets = [], + extensions = [] +) { return Object.keys(assets).map( - name => pattern.test(name) && { name, asset: assets[name] } + name => extensions.indexOf(path.extname(name)) >= 0 && { name, asset: assets[name] } ).filter(a => a); } From 1036450131ff2cde67c3c8b6f731e7a6fe25b26a Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 23 Jan 2017 11:32:46 +0200 Subject: [PATCH 085/168] chore - Make sure the plugin fails hard if paths aren't passed --- src/index.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/index.js b/src/index.js index cd413df..a551e23 100644 --- a/src/index.js +++ b/src/index.js @@ -4,6 +4,10 @@ const parse = require('./parse'); const search = require('./search'); module.exports = function PurifyPlugin(options) { + if (typeof options !== 'object' || !options.paths) { + throw new Error('You should pass an options object containing an array of paths at least'); + } + return { apply(compiler) { compiler.plugin('this-compilation', (compilation) => { From 203bcca3d00e64ee58273056c5091cbfc35fd8db Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 23 Jan 2017 11:41:15 +0200 Subject: [PATCH 086/168] chore - Update changelog --- CHANGELOG.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 572ca48..2866ca3 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,9 +1,9 @@ ## purifycss-webpack -0.1.0 / 2017-XX-XX +0.1.0 / 2017-01-23 ================== - * TODO + * Complete rewrite with more functionality and a new API. Different name due to npm issues. ## purifycss-webpack-plugin From e9b38af1ff25e2eef8af954daa1e14719d3addd2 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 23 Jan 2017 11:41:37 +0200 Subject: [PATCH 087/168] Update dist From 8e9f969c29af692a6680f6571282fc109b700e2c Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 23 Jan 2017 11:41:37 +0200 Subject: [PATCH 088/168] 0.1.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 17167d7..14e40a7 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.0.0", + "version": "0.1.0", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From 0693a48b1976f773853a46fd3d16cf70d3ad8e1f Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 23 Jan 2017 12:38:59 +0200 Subject: [PATCH 089/168] fix - Include `lib` to distribution --- CHANGELOG.md | 5 +++++ package.json | 3 ++- 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 2866ca3..78d4422 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.1.1 / 2017-01-23 +================== + + * Bug fix - Include `lib` to distribution to avoid installation failure. + 0.1.0 / 2017-01-23 ================== diff --git a/package.json b/package.json index 14e40a7..b195f46 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,8 @@ "purify" ], "files": [ - "dist" + "dist", + "lib" ], "jest": { "collectCoverage": true, From e892a7e248ed2693fe4e9747cf9e74181a011162 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 23 Jan 2017 12:39:24 +0200 Subject: [PATCH 090/168] Update dist From c9744fcfa6bcaed3ca30401b94a0e8ff3a799e25 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 23 Jan 2017 12:39:25 +0200 Subject: [PATCH 091/168] 0.1.1 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index b195f46..d388305 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.1.0", + "version": "0.1.1", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From 5bb81fc5d3f71c562ada483dc3810d58783e91bf Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 24 Jan 2017 13:25:17 +0200 Subject: [PATCH 092/168] feat - Add stricter plugin option validation --- CHANGELOG.md | 5 +++++ __tests__/test-validate-options.js | 32 +++++++++++++++++++++++++++ examples/webpack.config.js | 4 ++-- package.json | 5 +++-- src/index.js | 7 ++++-- src/schema.js | 35 ++++++++++++++++++++++++++++++ src/validate-options.js | 14 ++++++++++++ 7 files changed, 96 insertions(+), 6 deletions(-) create mode 100644 __tests__/test-validate-options.js create mode 100644 src/schema.js create mode 100644 src/validate-options.js diff --git a/CHANGELOG.md b/CHANGELOG.md index 78d4422..1f59bb9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.2.0 / 2017-01-24 +================== + + * Feature - Add stricter plugin option validation. + 0.1.1 / 2017-01-23 ================== diff --git a/__tests__/test-validate-options.js b/__tests__/test-validate-options.js new file mode 100644 index 0000000..a298fd1 --- /dev/null +++ b/__tests__/test-validate-options.js @@ -0,0 +1,32 @@ +const assert = require('assert'); +const validateOptions = require('../src/validate-options').default; + +describe('Validate options', function () { + it('fails empty data', function () { + const result = validateOptions(); + + assert.ok(!result.isValid); + assert.ok(result.error); + }); + + it('fails empty data', function () { + const result = validateOptions({}); + + assert.ok(!result.isValid); + assert.ok(result.error); + }); + + it('does not fail if paths are provided', function () { + const result = validateOptions({ paths: ['./foo'] }); + + assert.ok(result.isValid); + assert.ok(!result.error); + }); + + it('does not allow arbitrary properties', function () { + const result = validateOptions({ paths: ['./foo'], foobar: ['./foo'] }); + + assert.ok(!result.isValid); + assert.ok(result.error); + }); +}); diff --git a/examples/webpack.config.js b/examples/webpack.config.js index 98b2978..9662640 100644 --- a/examples/webpack.config.js +++ b/examples/webpack.config.js @@ -25,7 +25,7 @@ module.exports = [ parts.purifyCSS({ verbose: true, paths: glob.sync(`${PATHS.app}/*`), - extensions: ['.css', '.html'] + fileExtensions: ['.css'] }) ), merge( @@ -45,7 +45,7 @@ module.exports = [ first: glob.sync(`${PATHS.app}/*`), second: glob.sync(`${PATHS.another}/*`) }, - extensions: ['.css', '.html'] + fileExtensions: ['.css'] }) ) ]; diff --git a/package.json b/package.json index d388305..7e85421 100644 --- a/package.json +++ b/package.json @@ -46,8 +46,9 @@ "webpack": "^1.9 || 2 || ^2.1.0-beta || ^2.2.0-rc" }, "dependencies": { - "webpack-sources": "^0.1.4", - "purify-css": "^1.1.9" + "ajv": "^4.11.2", + "purify-css": "^1.1.9", + "webpack-sources": "^0.1.4" }, "devDependencies": { "babel-cli": "^6.18.0", diff --git a/src/index.js b/src/index.js index a551e23..770d83c 100644 --- a/src/index.js +++ b/src/index.js @@ -2,10 +2,13 @@ const purify = require('purify-css'); const ConcatSource = require('webpack-sources').ConcatSource; const parse = require('./parse'); const search = require('./search'); +const validateOptions = require('./validate-options').default; module.exports = function PurifyPlugin(options) { - if (typeof options !== 'object' || !options.paths) { - throw new Error('You should pass an options object containing an array of paths at least'); + const validation = validateOptions(options); + + if (!validation.isValid) { + throw new Error(validation.error); } return { diff --git a/src/schema.js b/src/schema.js new file mode 100644 index 0000000..d0c7113 --- /dev/null +++ b/src/schema.js @@ -0,0 +1,35 @@ +export default { + $schema: 'http://json-schema.org/draft-04/schema#', + additionalProperties: false, + type: 'object', + properties: { + fileExtensions: { + type: 'array', + items: { + type: 'string' + } + }, + moduleExtensions: { + type: 'array', + items: { + type: 'string' + } + }, + paths: { + type: ['array', 'object'], + items: { + type: 'string' + } + }, + purifyOptions: { + type: 'object', + properties: {} + }, + verbose: { + type: 'boolean' + } + }, + required: [ + 'paths' + ] +}; diff --git a/src/validate-options.js b/src/validate-options.js new file mode 100644 index 0000000..b1405b9 --- /dev/null +++ b/src/validate-options.js @@ -0,0 +1,14 @@ +import Ajv from 'ajv'; +import schema from './schema'; + +function validateOptions(data) { + const ajv = new Ajv(); + const isValid = ajv.validate(schema, data); + + return { + isValid, + error: ajv.errors && ajv.errorsText() + }; +} + +export default validateOptions; From 85d52a6d4df57e60a6cbf50b7297a8d3da9a29e9 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 24 Jan 2017 13:29:15 +0200 Subject: [PATCH 093/168] chore - Port to ES6 imports --- src/index.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/index.js b/src/index.js index 770d83c..fb61b54 100644 --- a/src/index.js +++ b/src/index.js @@ -1,8 +1,8 @@ -const purify = require('purify-css'); -const ConcatSource = require('webpack-sources').ConcatSource; -const parse = require('./parse'); -const search = require('./search'); -const validateOptions = require('./validate-options').default; +import purify from 'purify-css'; +import { ConcatSource } from 'webpack-sources'; +import * as parse from './parse'; +import * as search from './search'; +import validateOptions from './validate-options'; module.exports = function PurifyPlugin(options) { const validation = validateOptions(options); From 73dfa1172aef06fb1de11f41ae1845adc7d2173f Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 24 Jan 2017 13:34:08 +0200 Subject: [PATCH 094/168] Update dist From ffeeb5923fc77b9cd468e0f92968453eb6ab3be3 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 24 Jan 2017 13:34:09 +0200 Subject: [PATCH 095/168] 0.2.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 7e85421..3157861 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.1.1", + "version": "0.2.0", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From 840f18567c885fd456e10b9baf467c7afcd4fd4a Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 24 Jan 2017 14:12:59 +0200 Subject: [PATCH 096/168] fix - Include webpack 2 properly to the peer dependency --- CHANGELOG.md | 5 +++++ package.json | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 1f59bb9..c06c1ff 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.2.1 / 2017-01-24 +================== + + * Bug fix - Include webpack 2 properly to the peer dependency. + 0.2.0 / 2017-01-24 ================== diff --git a/package.json b/package.json index 3157861..8f77116 100644 --- a/package.json +++ b/package.json @@ -43,7 +43,7 @@ }, "homepage": "https://github.com/webpack-contrib/purifycss-webpack", "peerDependencies": { - "webpack": "^1.9 || 2 || ^2.1.0-beta || ^2.2.0-rc" + "webpack": "^1.9 || ^2.2.0 || ^2.1.0-beta || ^2.2.0-rc" }, "dependencies": { "ajv": "^4.11.2", From e03d3e6813ffd2fdf2730aff7dabe5d7823e9b6f Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 24 Jan 2017 14:13:22 +0200 Subject: [PATCH 097/168] Update dist From f246f9396e2ec859a6540c6da93d16765b99de41 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 24 Jan 2017 14:13:22 +0200 Subject: [PATCH 098/168] 0.2.1 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 8f77116..55bf626 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.2.0", + "version": "0.2.1", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From 0aa1fbbb9d441c3422ba8f9219aed24d88a3855e Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 24 Jan 2017 14:43:04 +0200 Subject: [PATCH 099/168] chore - Improve wording --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index f9e000c..9aac67f 100644 --- a/README.md +++ b/README.md @@ -22,7 +22,7 @@ Then configure as follows: const path = require('path'); const glob = require('glob'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); -const PurifyPlugin = require('purifycss-webpack'); +const PurifyCSSPlugin = require('purifycss-webpack'); module.exports = { entry: {...}, @@ -41,7 +41,7 @@ module.exports = { plugins: [ new ExtractTextPlugin('[name].[contenthash].css'), // Make sure this is after ExtractTextPlugin! - new PurifyPlugin({ + new PurifyCSSPlugin({ // Give paths to parse for rules. These should be absolute! paths: glob.sync(path.join(__dirname, 'app/*.html')), }) From 0580eb156fddd190b76ede87d5a9ebfc4a9bf1d0 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 24 Jan 2017 14:50:32 +0200 Subject: [PATCH 100/168] chore - Push defaults to JSON Schema --- __tests__/test-validate-options.js | 12 ++++++++++++ src/index.js | 2 +- src/schema.js | 3 ++- src/validate-options.js | 4 +++- 4 files changed, 18 insertions(+), 3 deletions(-) diff --git a/__tests__/test-validate-options.js b/__tests__/test-validate-options.js index a298fd1..4240b38 100644 --- a/__tests__/test-validate-options.js +++ b/__tests__/test-validate-options.js @@ -29,4 +29,16 @@ describe('Validate options', function () { assert.ok(!result.isValid); assert.ok(result.error); }); + + it('fileExtensions have defaults', function () { + const paths = ['./foo']; + const data = { paths }; + + // Currently this mutates data with defaults due to ajv design. It + // might be a good idea to change that behavior, though. + const result = validateOptions(data); + + assert.deepEqual(data, { paths, fileExtensions: ['.css'] }); + assert.ok(!result.error); + }); }); diff --git a/src/index.js b/src/index.js index fb61b54..177e00c 100644 --- a/src/index.js +++ b/src/index.js @@ -27,7 +27,7 @@ module.exports = function PurifyPlugin(options) { compilation.chunks.forEach( ({ name: chunkName, modules }) => { const assetsToPurify = search.assets( - compilation.assets, options.fileExtensions || ['.css'] + compilation.assets, options.fileExtensions ).filter( asset => asset.name.indexOf(chunkName) >= 0 ); diff --git a/src/schema.js b/src/schema.js index d0c7113..8a5649d 100644 --- a/src/schema.js +++ b/src/schema.js @@ -7,7 +7,8 @@ export default { type: 'array', items: { type: 'string' - } + }, + default: ['.css'] }, moduleExtensions: { type: 'array', diff --git a/src/validate-options.js b/src/validate-options.js index b1405b9..1595ef5 100644 --- a/src/validate-options.js +++ b/src/validate-options.js @@ -2,7 +2,9 @@ import Ajv from 'ajv'; import schema from './schema'; function validateOptions(data) { - const ajv = new Ajv(); + const ajv = new Ajv({ + useDefaults: true // This mutates the original data with defaults! + }); const isValid = ajv.validate(schema, data); return { From 0c61c472d2ff9784beade7eef33c610694affcdb Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 24 Jan 2017 14:51:26 +0200 Subject: [PATCH 101/168] Update changelog --- CHANGELOG.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index c06c1ff..02d753f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.2.2 / 2017-01-24 +================== + + * Chore - Push option defaults to schema. + 0.2.1 / 2017-01-24 ================== From 51c81d9749cfa5ec47c1ed4d42c1c6ab166fb826 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 24 Jan 2017 14:51:42 +0200 Subject: [PATCH 102/168] Update dist From 185799f7a20b07862047009cd5fef04cc6247642 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 24 Jan 2017 14:51:43 +0200 Subject: [PATCH 103/168] 0.2.2 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 55bf626..808f283 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.2.1", + "version": "0.2.2", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From dabce52478650418efb38fb0632b90c98db849b3 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 26 Jan 2017 10:32:29 +0200 Subject: [PATCH 104/168] chore - Co-locate tests with source A little tidier this way. --- __tests__/test-parse.js => src/parse.test.js | 2 +- __tests__/test-search.js => src/search.test.js | 2 +- .../test-validate-options.js => src/validate-options.test.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) rename __tests__/test-parse.js => src/parse.test.js (92%) rename __tests__/test-search.js => src/search.test.js (96%) rename __tests__/test-validate-options.js => src/validate-options.test.js (94%) diff --git a/__tests__/test-parse.js b/src/parse.test.js similarity index 92% rename from __tests__/test-parse.js rename to src/parse.test.js index dd146c5..9046b3d 100644 --- a/__tests__/test-parse.js +++ b/src/parse.test.js @@ -1,5 +1,5 @@ const assert = require('assert'); -const parse = require('../src/parse'); +const parse = require('./parse'); describe('Parse paths', function () { it('returns an empty array by default', function () { diff --git a/__tests__/test-search.js b/src/search.test.js similarity index 96% rename from __tests__/test-search.js rename to src/search.test.js index 37fd438..5f57ef9 100644 --- a/__tests__/test-search.js +++ b/src/search.test.js @@ -1,5 +1,5 @@ const assert = require('assert'); -const search = require('../src/search'); +const search = require('./search'); describe('Search assets', function () { it('returns nothing if nothing is passed', function () { diff --git a/__tests__/test-validate-options.js b/src/validate-options.test.js similarity index 94% rename from __tests__/test-validate-options.js rename to src/validate-options.test.js index 4240b38..a0d509c 100644 --- a/__tests__/test-validate-options.js +++ b/src/validate-options.test.js @@ -1,5 +1,5 @@ const assert = require('assert'); -const validateOptions = require('../src/validate-options').default; +const validateOptions = require('./validate-options').default; describe('Validate options', function () { it('fails empty data', function () { From 92d747045903c438de784b41692fcb8e0d6b2618 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 26 Jan 2017 10:53:05 +0200 Subject: [PATCH 105/168] breaking - Rename `fileExtensions` as `styleExtensions` Cleaner this way. --- CHANGELOG.md | 5 +++++ README.md | 2 +- examples/webpack.config.js | 4 ++-- src/index.js | 2 +- src/schema.js | 2 +- src/validate-options.test.js | 4 ++-- 6 files changed, 12 insertions(+), 7 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 02d753f..964cbb0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.3.0 / 2017-01-26 +================== + + * Breaking - Rename `fileExtensions` as `styleExtensions`. This communicates better how it works underneath. + 0.2.2 / 2017-01-24 ================== diff --git a/README.md b/README.md index 9aac67f..bdfff25 100644 --- a/README.md +++ b/README.md @@ -59,7 +59,7 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su | Property | Description |---------------------|------------ -| `fileExtensions` | An array of file extensions for determining used classes. Defaults to `['.css']`. +| `styleExtensions` | An array of file extensions for determining used classes within style files. Defaults to `['.css']`. | `moduleExtensions` | An array of file extensions for determining used classes within `node_modules`. Defaults to `[]`, but `['.html']` can be useful here. | `paths` | An array of absolute paths or a path to traverse. This also accepts an object (` -> `). It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). diff --git a/examples/webpack.config.js b/examples/webpack.config.js index 9662640..02f5e6b 100644 --- a/examples/webpack.config.js +++ b/examples/webpack.config.js @@ -25,7 +25,7 @@ module.exports = [ parts.purifyCSS({ verbose: true, paths: glob.sync(`${PATHS.app}/*`), - fileExtensions: ['.css'] + styleExtensions: ['.css'] }) ), merge( @@ -45,7 +45,7 @@ module.exports = [ first: glob.sync(`${PATHS.app}/*`), second: glob.sync(`${PATHS.another}/*`) }, - fileExtensions: ['.css'] + styleExtensions: ['.css'] }) ) ]; diff --git a/src/index.js b/src/index.js index 177e00c..04700f4 100644 --- a/src/index.js +++ b/src/index.js @@ -27,7 +27,7 @@ module.exports = function PurifyPlugin(options) { compilation.chunks.forEach( ({ name: chunkName, modules }) => { const assetsToPurify = search.assets( - compilation.assets, options.fileExtensions + compilation.assets, options.styleExtensions ).filter( asset => asset.name.indexOf(chunkName) >= 0 ); diff --git a/src/schema.js b/src/schema.js index 8a5649d..ebc7483 100644 --- a/src/schema.js +++ b/src/schema.js @@ -3,7 +3,7 @@ export default { additionalProperties: false, type: 'object', properties: { - fileExtensions: { + styleExtensions: { type: 'array', items: { type: 'string' diff --git a/src/validate-options.test.js b/src/validate-options.test.js index a0d509c..6bada0d 100644 --- a/src/validate-options.test.js +++ b/src/validate-options.test.js @@ -30,7 +30,7 @@ describe('Validate options', function () { assert.ok(result.error); }); - it('fileExtensions have defaults', function () { + it('styleExtensions have defaults', function () { const paths = ['./foo']; const data = { paths }; @@ -38,7 +38,7 @@ describe('Validate options', function () { // might be a good idea to change that behavior, though. const result = validateOptions(data); - assert.deepEqual(data, { paths, fileExtensions: ['.css'] }); + assert.deepEqual(data, { paths, styleExtensions: ['.css'] }); assert.ok(!result.error); }); }); From d5fef655f45626ae2584e78d68696393db987f47 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 26 Jan 2017 10:53:32 +0200 Subject: [PATCH 106/168] Update dist From 4a3a6dfd704a8276035c9ac429a076af4c284c17 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 26 Jan 2017 10:53:32 +0200 Subject: [PATCH 107/168] 0.3.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 808f283..df09974 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.2.2", + "version": "0.3.0", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From e30be2bc116c39d926b4065c7b836ce6ae902a61 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 26 Jan 2017 14:19:06 +0200 Subject: [PATCH 108/168] fix - Make `search.files` more robust against potentially missing data Related to #67. --- CHANGELOG.md | 5 +++++ src/search.js | 4 ++++ src/search.test.js | 27 +++++++++++++++++++++++++++ 3 files changed, 36 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 964cbb0..35ba7b2 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.3.1 / 2017-01-26 +================== + + * Bug fix - Make `search.files` more robust against potentially missing data. #67 + 0.3.0 / 2017-01-26 ================== diff --git a/src/search.js b/src/search.js index 9ebeff3..cab74f4 100644 --- a/src/search.js +++ b/src/search.js @@ -17,6 +17,10 @@ function searchFiles( return Object.keys(modules).map((name) => { const file = getter(modules[name]); + if (!file) { + return null; + } + return extensions.indexOf(path.extname(file)) >= 0 && file; }).filter(a => a); } diff --git a/src/search.test.js b/src/search.test.js index 5f57ef9..512b7d7 100644 --- a/src/search.test.js +++ b/src/search.test.js @@ -31,6 +31,14 @@ describe('Search files', function () { assert.deepEqual(search.files(modules, extensions), matches); }); + it('does not fail with missing modules', function () { + const modules = ['foobar.txt', '', 'barbar.css']; + const extensions = ['.txt']; + const matches = ['foobar.txt']; + + assert.deepEqual(search.files(modules, extensions), matches); + }); + it('returns matches based on extension with a customized getter', function () { const modules = { foobar: { @@ -48,4 +56,23 @@ describe('Search files', function () { matches ); }); + + it('does not fail with missing modules when a getter fails', function () { + const modules = { + foobar: { + resource: 'foobar.txt' + }, + demo: {}, + barbar: { + resource: 'barbar.css' + } + }; + const extensions = ['.txt']; + const matches = ['foobar.txt']; + + assert.deepEqual( + search.files(modules, extensions, file => file.resource), + matches + ); + }); }); From 336245f798a4fe298807271ef7f6f9d7c9b71b11 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 26 Jan 2017 14:19:48 +0200 Subject: [PATCH 109/168] Update dist From 087b0f534303860f4577d88521a4d92df00dfc1b Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 26 Jan 2017 14:19:48 +0200 Subject: [PATCH 110/168] 0.3.1 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index df09974..85e6f19 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.3.0", + "version": "0.3.1", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From aac66fce91930e24cf3312da30dd25e10fe09cd7 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 27 Jan 2017 10:37:11 +0200 Subject: [PATCH 111/168] chore - Generalize validateOptions This could be extracted from the project. --- src/index.js | 3 ++- src/validate-options.js | 3 +-- src/validate-options.test.js | 23 +++++++++++++---------- 3 files changed, 16 insertions(+), 13 deletions(-) diff --git a/src/index.js b/src/index.js index 04700f4..e63d934 100644 --- a/src/index.js +++ b/src/index.js @@ -3,9 +3,10 @@ import { ConcatSource } from 'webpack-sources'; import * as parse from './parse'; import * as search from './search'; import validateOptions from './validate-options'; +import schema from './schema'; module.exports = function PurifyPlugin(options) { - const validation = validateOptions(options); + const validation = validateOptions(schema, options); if (!validation.isValid) { throw new Error(validation.error); diff --git a/src/validate-options.js b/src/validate-options.js index 1595ef5..aabbc0c 100644 --- a/src/validate-options.js +++ b/src/validate-options.js @@ -1,7 +1,6 @@ import Ajv from 'ajv'; -import schema from './schema'; -function validateOptions(data) { +function validateOptions(schema, data) { const ajv = new Ajv({ useDefaults: true // This mutates the original data with defaults! }); diff --git a/src/validate-options.test.js b/src/validate-options.test.js index 6bada0d..b064ad9 100644 --- a/src/validate-options.test.js +++ b/src/validate-options.test.js @@ -1,30 +1,33 @@ const assert = require('assert'); const validateOptions = require('./validate-options').default; +const schema = require('./schema').default; describe('Validate options', function () { - it('fails empty data', function () { - const result = validateOptions(); - - assert.ok(!result.isValid); - assert.ok(result.error); + it('fails without a schema and data', function () { + assert.throws( + () => { + validateOptions(); + }, + Error + ); }); - it('fails empty data', function () { - const result = validateOptions({}); + it('fails with empty data', function () { + const result = validateOptions(schema); assert.ok(!result.isValid); assert.ok(result.error); }); it('does not fail if paths are provided', function () { - const result = validateOptions({ paths: ['./foo'] }); + const result = validateOptions(schema, { paths: ['./foo'] }); assert.ok(result.isValid); assert.ok(!result.error); }); it('does not allow arbitrary properties', function () { - const result = validateOptions({ paths: ['./foo'], foobar: ['./foo'] }); + const result = validateOptions(schema, { paths: ['./foo'], foobar: ['./foo'] }); assert.ok(!result.isValid); assert.ok(result.error); @@ -36,7 +39,7 @@ describe('Validate options', function () { // Currently this mutates data with defaults due to ajv design. It // might be a good idea to change that behavior, though. - const result = validateOptions(data); + const result = validateOptions(schema, data); assert.deepEqual(data, { paths, styleExtensions: ['.css'] }); assert.ok(!result.error); From df7208e4d1a9db68b9b9d9fd204764f5f51ce9fd Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 27 Jan 2017 11:14:09 +0200 Subject: [PATCH 112/168] fix - Fail at validation if entry keys don't match with path keys Closes #67. --- CHANGELOG.md | 5 ++++ src/index.js | 17 +++++++++----- src/schema.js | 45 +++++++++++++++++++++++++++++------- src/schema.test.js | 21 +++++++++++++++++ src/validate-options.test.js | 24 +++++++++++++++---- 5 files changed, 94 insertions(+), 18 deletions(-) create mode 100644 src/schema.test.js diff --git a/CHANGELOG.md b/CHANGELOG.md index 35ba7b2..32f76a9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.3.2 / 2017-01-27 +================== + + * Bug fix - Fail at validation if entry keys don't match with path keys. #67 + 0.3.1 / 2017-01-26 ================== diff --git a/src/index.js b/src/index.js index e63d934..07c9fd2 100644 --- a/src/index.js +++ b/src/index.js @@ -6,14 +6,19 @@ import validateOptions from './validate-options'; import schema from './schema'; module.exports = function PurifyPlugin(options) { - const validation = validateOptions(schema, options); - - if (!validation.isValid) { - throw new Error(validation.error); - } - return { apply(compiler) { + const validation = validateOptions( + schema({ + entry: compiler.options.entry + }), + options + ); + + if (!validation.isValid) { + throw new Error(validation.error); + } + compiler.plugin('this-compilation', (compilation) => { const paths = parse.paths(options.paths); diff --git a/src/schema.js b/src/schema.js index ebc7483..217adb8 100644 --- a/src/schema.js +++ b/src/schema.js @@ -1,4 +1,4 @@ -export default { +const schema = ({ entry } = {}) => ({ $schema: 'http://json-schema.org/draft-04/schema#', additionalProperties: false, type: 'object', @@ -16,12 +16,7 @@ export default { type: 'string' } }, - paths: { - type: ['array', 'object'], - items: { - type: 'string' - } - }, + paths: parsePaths(entry), purifyOptions: { type: 'object', properties: {} @@ -33,4 +28,38 @@ export default { required: [ 'paths' ] -}; +}); + +function parsePaths(entry) { + const ret = { + type: ['array', 'object'] + }; + + if (entry instanceof Object) { + ret.additionalProperties = false; + ret.properties = generateProperties(entry); + } else { + ret.items = { + type: 'string' + }; + } + + return ret; +} + +function generateProperties(entry) { + const ret = {}; + + Object.keys(entry).forEach((e) => { + ret[e] = { + type: ['array', 'string'], + items: { + type: 'string' + } + }; + }); + + return ret; +} + +export default schema; diff --git a/src/schema.test.js b/src/schema.test.js new file mode 100644 index 0000000..8d01808 --- /dev/null +++ b/src/schema.test.js @@ -0,0 +1,21 @@ +const assert = require('assert'); +const schema = require('./schema').default; + +describe('Schema', function () { + it('converts an object entry to validation', function () { + const entry = { + a: 'foo' + }; + const result = schema({ entry }); + const expected = { + a: { + type: ['array', 'string'], + items: { + type: 'string' + } + } + }; + + assert.deepEqual(result.properties.paths.properties, expected); + }); +}); diff --git a/src/validate-options.test.js b/src/validate-options.test.js index b064ad9..fbae580 100644 --- a/src/validate-options.test.js +++ b/src/validate-options.test.js @@ -13,21 +13,21 @@ describe('Validate options', function () { }); it('fails with empty data', function () { - const result = validateOptions(schema); + const result = validateOptions(schema()); assert.ok(!result.isValid); assert.ok(result.error); }); it('does not fail if paths are provided', function () { - const result = validateOptions(schema, { paths: ['./foo'] }); + const result = validateOptions(schema(), { paths: ['./foo'] }); assert.ok(result.isValid); assert.ok(!result.error); }); it('does not allow arbitrary properties', function () { - const result = validateOptions(schema, { paths: ['./foo'], foobar: ['./foo'] }); + const result = validateOptions(schema(), { paths: ['./foo'], foobar: ['./foo'] }); assert.ok(!result.isValid); assert.ok(result.error); @@ -39,9 +39,25 @@ describe('Validate options', function () { // Currently this mutates data with defaults due to ajv design. It // might be a good idea to change that behavior, though. - const result = validateOptions(schema, data); + const result = validateOptions(schema(), data); assert.deepEqual(data, { paths, styleExtensions: ['.css'] }); assert.ok(!result.error); }); + + it('fails without matching path keys', function () { + const data = { + paths: { + a: './foo' + } + }; + + const result = validateOptions(schema({ + entry: { + b: './bar' + } + }), data); + + assert.ok(result.error); + }); }); From 8fd3b0ad0e11728efbfdf96abe1eef21e18ae666 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 27 Jan 2017 11:18:59 +0200 Subject: [PATCH 113/168] feat - Expose `minimize` flag for CSS minification --- CHANGELOG.md | 3 ++- README.md | 1 + examples/webpack.config.js | 1 + src/index.js | 1 + src/schema.js | 3 +++ 5 files changed, 8 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 32f76a9..4d0e36f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,9 +1,10 @@ ## purifycss-webpack -0.3.2 / 2017-01-27 +0.4.0 / 2017-01-27 ================== * Bug fix - Fail at validation if entry keys don't match with path keys. #67 + * Feature - Expose `minimize` flag for CSS minification. 0.3.1 / 2017-01-26 ================== diff --git a/README.md b/README.md index bdfff25..79eb049 100644 --- a/README.md +++ b/README.md @@ -61,6 +61,7 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su |---------------------|------------ | `styleExtensions` | An array of file extensions for determining used classes within style files. Defaults to `['.css']`. | `moduleExtensions` | An array of file extensions for determining used classes within `node_modules`. Defaults to `[]`, but `['.html']` can be useful here. +| `minimize` | Enable CSS minification. Alias to `purifyOptions.minify`. Disabled by default. | `paths` | An array of absolute paths or a path to traverse. This also accepts an object (` -> `). It can be a good idea [glob](http://npmjs.org/glob) these. | `purifyOptions` | Pass [custom options to PurifyCSS](https://github.com/purifycss/purifycss#the-optional-options-argument). | `verbose` | Set this flag to get verbose output from the plugin. This sets `purifyOptions.info`, but you can override `info` separately if you want less logging. diff --git a/examples/webpack.config.js b/examples/webpack.config.js index 02f5e6b..aacb91d 100644 --- a/examples/webpack.config.js +++ b/examples/webpack.config.js @@ -24,6 +24,7 @@ module.exports = [ parts.extractCSS(), parts.purifyCSS({ verbose: true, + minimize: true, paths: glob.sync(`${PATHS.app}/*`), styleExtensions: ['.css'] }) diff --git a/src/index.js b/src/index.js index 07c9fd2..0c2ea2a 100644 --- a/src/index.js +++ b/src/index.js @@ -63,6 +63,7 @@ module.exports = function PurifyPlugin(options) { asset.source(), { info: options.verbose, + minify: options.minimize, ...options.purifyOptions } ) diff --git a/src/schema.js b/src/schema.js index 217adb8..cce104d 100644 --- a/src/schema.js +++ b/src/schema.js @@ -10,6 +10,9 @@ const schema = ({ entry } = {}) => ({ }, default: ['.css'] }, + minimize: { + type: 'boolean' + }, moduleExtensions: { type: 'array', items: { From 2c7199275d51e6e3a7b6fcf5b6c39e6c21dab121 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 27 Jan 2017 11:19:52 +0200 Subject: [PATCH 114/168] chore - Improve example build instructions Maybe this could be simplified? Closes #70. --- examples/README.md | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/examples/README.md b/examples/README.md index 5d2544b..38f104a 100644 --- a/examples/README.md +++ b/examples/README.md @@ -1,3 +1,5 @@ -1. `npm install` +1. `npm install` at project root 2. `npm run build` -3. Examine `./build` +3. `cd examples` +4. `npm run build` +5. Examine `./build` From 4d9013890f888c0d9f917d934ebe65e4bcb9ae05 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 27 Jan 2017 12:17:42 +0200 Subject: [PATCH 115/168] fix - Support `: ` style entries Closes #71. --- CHANGELOG.md | 1 + src/index.js | 4 ++-- src/parse.js | 19 +++++++++++++++-- src/parse.test.js | 53 +++++++++++++++++++++++++++++++++++++++++++---- 4 files changed, 69 insertions(+), 8 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 4d0e36f..8e0b426 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,7 @@ 0.4.0 / 2017-01-27 ================== + * Bug fix - Support `: ` style entries. #71 * Bug fix - Fail at validation if entry keys don't match with path keys. #67 * Feature - Expose `minimize` flag for CSS minification. diff --git a/src/index.js b/src/index.js index 0c2ea2a..f4e6977 100644 --- a/src/index.js +++ b/src/index.js @@ -20,7 +20,7 @@ module.exports = function PurifyPlugin(options) { } compiler.plugin('this-compilation', (compilation) => { - const paths = parse.paths(options.paths); + const entryPaths = parse.entryPaths(options.paths); // Output debug information through a callback pattern // to avoid unnecessary processing @@ -44,7 +44,7 @@ module.exports = function PurifyPlugin(options) { ]); assetsToPurify.forEach(({ name, asset }) => { - const filesToSearch = (paths[chunkName] || paths).concat( + const filesToSearch = parse.entries(entryPaths, chunkName).concat( search.files( modules, options.moduleExtensions || [], file => file.resource ) diff --git a/src/parse.js b/src/parse.js index e3e536c..a97aa3f 100644 --- a/src/parse.js +++ b/src/parse.js @@ -1,4 +1,4 @@ -function parsePaths(paths) { +function parseEntryPaths(paths) { const ret = paths || []; // Convert possible string to an array @@ -9,6 +9,21 @@ function parsePaths(paths) { return ret; } +function parseEntries(paths, chunkName) { + if (Array.isArray(paths)) { + return paths; + } + + if (!(chunkName in paths)) { + throw new Error(`Failed to find ${chunkName} in ${paths.join(', ')}`); + } + + const ret = paths[chunkName]; + + return Array.isArray(ret) ? ret : [ret]; +} + module.exports = { - paths: parsePaths + entryPaths: parseEntryPaths, + entries: parseEntries }; diff --git a/src/parse.test.js b/src/parse.test.js index 9046b3d..262b56f 100644 --- a/src/parse.test.js +++ b/src/parse.test.js @@ -1,20 +1,65 @@ const assert = require('assert'); const parse = require('./parse'); -describe('Parse paths', function () { +describe('Parse entry paths', function () { it('returns an empty array by default', function () { - assert.deepEqual(parse.paths(), []); + assert.deepEqual(parse.entryPaths(), []); }); it('returns an object as itself', function () { const o = { a: ['a', 'b', 'c'] }; - assert.deepEqual(parse.paths(o), o); + assert.deepEqual(parse.entryPaths(o), o); }); it('puts a string inside an array', function () { const str = 'foobar'; - assert.deepEqual(parse.paths(str), [str]); + assert.deepEqual(parse.entryPaths(str), [str]); + }); +}); + +describe('Parse entries', function () { + it('returns paths if there is no chunk name', function () { + const paths = ['a', 'b', 'c']; + + assert.deepEqual(parse.entries(paths), paths); + }); + + it('returns paths if paths are an array already', function () { + const paths = ['a', 'b', 'c']; + + assert.deepEqual(parse.entries(paths, 'foobar'), paths); + }); + + it('returns chunk paths', function () { + const entryPaths = ['a', 'b', 'c']; + const paths = { + foobar: entryPaths + }; + + assert.deepEqual(parse.entries(paths, 'foobar'), entryPaths); + }); + + it('returns chunk path wrapped in an array', function () { + const entryPaths = 'a'; + const paths = { + foobar: entryPaths + }; + + assert.deepEqual(parse.entries(paths, 'foobar'), [entryPaths]); + }); + + it('throws an error if failed to find entry', function () { + const paths = { + foobar: 'a' + }; + + assert.throws( + () => { + parse.entries(paths, 'barfoo'); + }, + Error + ); }); }); From 2edb78d65badf293dde5e2643d13d88363c60d85 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 27 Jan 2017 12:23:30 +0200 Subject: [PATCH 116/168] Update dist From 7ded6324ea8ef749d048e93b78eb3a7a1a9cde6c Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 27 Jan 2017 12:23:31 +0200 Subject: [PATCH 117/168] 0.4.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 85e6f19..a3a9bab 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.3.1", + "version": "0.4.0", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From 6b9cce03813f4825796e5b70bec6f16c89525203 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Sat, 28 Jan 2017 13:18:32 +0200 Subject: [PATCH 118/168] fix - If an entry name does not match while processing, skip it Closes #72. --- CHANGELOG.md | 5 +++++ src/parse.js | 2 +- src/parse.test.js | 18 +++++++++++------- 3 files changed, 17 insertions(+), 8 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 8e0b426..cd00b0e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.4.1 / 2017-01-28 +================== + + * Bug fix - If an entry name does not match while processing, skip it. #72 + 0.4.0 / 2017-01-27 ================== diff --git a/src/parse.js b/src/parse.js index a97aa3f..58ffee1 100644 --- a/src/parse.js +++ b/src/parse.js @@ -15,7 +15,7 @@ function parseEntries(paths, chunkName) { } if (!(chunkName in paths)) { - throw new Error(`Failed to find ${chunkName} in ${paths.join(', ')}`); + return []; } const ret = paths[chunkName]; diff --git a/src/parse.test.js b/src/parse.test.js index 262b56f..721df94 100644 --- a/src/parse.test.js +++ b/src/parse.test.js @@ -50,16 +50,20 @@ describe('Parse entries', function () { assert.deepEqual(parse.entries(paths, 'foobar'), [entryPaths]); }); - it('throws an error if failed to find entry', function () { + it('returns an empty array if failed to find entry', function () { const paths = { foobar: 'a' }; - assert.throws( - () => { - parse.entries(paths, 'barfoo'); - }, - Error - ); + assert.deepEqual(parse.entries(paths, 'barbar'), []); + }); + + it('returns an empty array if failed to find entry with multiple paths', function () { + const paths = { + foobar: 'a', + barbar: 'b' + }; + + assert.deepEqual(parse.entries(paths, 'foofoo'), []); }); }); From 3fff17eb88c44512c45aa06c7346aa9447723709 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Sat, 28 Jan 2017 13:22:35 +0200 Subject: [PATCH 119/168] Update dist From c9530115bebd75900a5902114874b8b5b0f97d4c Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Sat, 28 Jan 2017 13:22:35 +0200 Subject: [PATCH 120/168] 0.4.1 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index a3a9bab..1024001 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.4.0", + "version": "0.4.1", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From 8d3319cc2f1c784fcabe0db3db96c1821fb51d53 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Sat, 28 Jan 2017 19:30:10 +0200 Subject: [PATCH 121/168] feat - Show nicer errors if there are extra fields --- CHANGELOG.md | 5 +++++ src/validate-options.js | 3 ++- 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index cd00b0e..33b2c44 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.4.2 / 2017-01-28 +================== + + * Feature - Show nicer errors if there are extra fields. + 0.4.1 / 2017-01-28 ================== diff --git a/src/validate-options.js b/src/validate-options.js index aabbc0c..c06ec45 100644 --- a/src/validate-options.js +++ b/src/validate-options.js @@ -2,7 +2,8 @@ import Ajv from 'ajv'; function validateOptions(schema, data) { const ajv = new Ajv({ - useDefaults: true // This mutates the original data with defaults! + useDefaults: true, // This mutates the original data with defaults! + errorDataPath: 'property' }); const isValid = ajv.validate(schema, data); From 0bbba37fd0ee8bb73cac5f83427fcbac8d029f9b Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Sat, 28 Jan 2017 19:30:35 +0200 Subject: [PATCH 122/168] Update dist From d98a2fd360de04f976f0a812d1d20bdc755277f5 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Sat, 28 Jan 2017 19:30:35 +0200 Subject: [PATCH 123/168] 0.4.2 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 1024001..4c13d73 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.4.1", + "version": "0.4.2", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From bbbe1726672a055cb350ca89cc7e39e78f260886 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Sat, 28 Jan 2017 19:56:51 +0200 Subject: [PATCH 124/168] chore - Collect coverage only from source --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index 4c13d73..2fd2306 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ ], "jest": { "collectCoverage": true, + "collectCoverageFrom": "src/**/*.js", "moduleFileExtensions": [ "js" ], From 5fad2925423e846269b94711576f42f2dc9554e5 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Sun, 29 Jan 2017 20:00:24 +0200 Subject: [PATCH 125/168] fix - Fix postinstall script typo --- lib/post_install.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/post_install.js b/lib/post_install.js index 2c4ee48..a4b4a93 100644 --- a/lib/post_install.js +++ b/lib/post_install.js @@ -22,7 +22,7 @@ stat('dist', function(error, stat) { } if (error || !stat.isDirectory()) { - exec('npm i babel-cli babel-preset-es2015 babel-plugin-syntax-object-rest-spread babel-transform-syntax-object-rest-spread'); + exec('npm i babel-cli babel-preset-es2015 babel-plugin-syntax-object-rest-spread babel-plugin-transform-syntax-object-rest-spread'); exec('npm run build'); } }); From 8d559038484b63f9337e448bb469e7fda465fe76 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Sun, 29 Jan 2017 20:02:02 +0200 Subject: [PATCH 126/168] chore - Fix postinstall part 2 --- lib/post_install.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/post_install.js b/lib/post_install.js index a4b4a93..06da9da 100644 --- a/lib/post_install.js +++ b/lib/post_install.js @@ -22,7 +22,7 @@ stat('dist', function(error, stat) { } if (error || !stat.isDirectory()) { - exec('npm i babel-cli babel-preset-es2015 babel-plugin-syntax-object-rest-spread babel-plugin-transform-syntax-object-rest-spread'); + exec('npm i babel-cli babel-preset-es2015 babel-plugin-syntax-object-rest-spread babel-plugin-transform-object-rest-spread'); exec('npm run build'); } }); From b2e5c2e6b1134e2b1e686a88745eb9140048efc7 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Sat, 4 Feb 2017 18:05:24 +0200 Subject: [PATCH 127/168] chore - Drop a redundant Node 0.10 check --- lib/post_install.js | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/lib/post_install.js b/lib/post_install.js index 06da9da..8d6218c 100644 --- a/lib/post_install.js +++ b/lib/post_install.js @@ -1,14 +1,9 @@ /* eslint-disable */ // adapted based on rackt/history (MIT) -// Node 0.10+ +// Node 4+ var execSync = require('child_process').execSync; var stat = require('fs').stat; -// Node 0.10 check -if (!execSync) { - execSync = require('sync-exec'); -} - function exec(command) { execSync(command, { stdio: [0, 1, 2] From 6228084c487f84810d2eac3cb944511b4b5ddd01 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Sat, 4 Feb 2017 18:06:29 +0200 Subject: [PATCH 128/168] chore - Build before testing --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index 2fd2306..fea14c2 100644 --- a/package.json +++ b/package.json @@ -68,6 +68,7 @@ "jest": "^18.1.0" }, "pre-push": [ + "build", "test:all" ] } From 5ec33f21e1944c526a70efb727ad438b0596322c Mon Sep 17 00:00:00 2001 From: Joshua Wiens Date: Tue, 21 Feb 2017 04:37:39 -0600 Subject: [PATCH 129/168] docs(readme): updates for JSF maintainers --- README.md | 85 +++++++++++++++++++++++++++++++++++++++++++++++-------- 1 file changed, 73 insertions(+), 12 deletions(-) diff --git a/README.md b/README.md index 79eb049..9227908 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,19 @@ -[![build status](https://secure.travis-ci.org/webpack-contrib/purifycss-webpack.svg)](http://travis-ci.org/webpack-contrib/purifycss-webpack) [![bitHound Score](https://www.bithound.io/github/webpack-contrib/purifycss-webpack/badges/score.svg)](https://www.bithound.io/github/webpack-contrib/purifycss-webpack) [![codecov](https://codecov.io/gh/webpack-contrib/purifycss-webpack/branch/master/graph/badge.svg)](https://codecov.io/gh/webpack-contrib/purifycss-webpack) - -# PurifyCSS for Webpack +[![npm][npm]][npm-url] +[![deps][deps]][deps-url] +[![test][test]][test-url] +[![coverage][cover]][cover-url] +[![quality][quality]][quality-url] +[![chat][chat]][chat-url] + +
+ + + + +

PurifyCSS Plugin

+

PurifyCSS for Webpack.

+

This plugin uses [PurifyCSS](https://github.com/purifycss/purifycss) to remove unused selectors from your CSS. You **should** use it with the [extract-text-webpack-plugin](https://www.npmjs.com/package/extract-text-webpack-plugin). @@ -8,15 +21,15 @@ Without any CSS file being emitted as an asset, this plugin will do nothing. You > This plugin replaces earlier [purifycss-webpack-plugin](https://www.npmjs.com/package/purifycss-webpack-plugin) and it has a different API! -## Usage - -First, install it: +

Install

```bash -npm install purifycss-webpack --save-dev +npm i -D purifycss-webpack ``` -Then configure as follows: +

Usage

+ +Configure as follows: ```javascript const path = require('path'); @@ -53,7 +66,7 @@ And, that's it! Your scripts and view files will be scanned for classes, and tho > You can pass an object (` -> []`) to `paths` if you want to control the behavior per entry. -## Options +

Options

This plugin, unlike the original PurifyCSS plugin, provides special features, such as scanning the dependency files. You can configure using the following fields: @@ -68,6 +81,54 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su > The plugin does **not** emit sourcemaps even if you enable `sourceMap` option on loaders! -## License - -ISC. +

Maintainers

+ + + + + + + + + + +
+ +
+ Juho Vepsäläinen + 		+ +
+ Joshua Wiens + 		+ +
+ Kees Kluskens + 		+ +
+ Sean Larkin +
+ + +[npm]: https://img.shields.io/npm/v/purifycss-webpack.svg +[npm-url]: https://npmjs.com/package/purifycss-webpack + +[deps]: https://david-dm.org/webpack-contrib/purifycss-webpack.svg +[deps-url]: https://david-dm.org/webpack-contrib/purifycss-webpack + +[chat]: https://img.shields.io/badge/gitter-webpack%2Fwebpack-brightgreen.svg +[chat-url]: https://gitter.im/webpack/webpack + +[test]: https://secure.travis-ci.org/webpack-contrib/purifycss-webpack.svg +[test-url]: http://travis-ci.org/webpack-contrib/purifycss-webpack + +[cover]: https://codecov.io/gh/webpack-contrib/purifycss-webpack/branch/master/graph/badge.svg +[cover-url]: https://codecov.io/gh/webpack-contrib/purifycss-webpack + +[quality]: https://www.bithound.io/github/webpack-contrib/purifycss-webpack/badges/score.svg +[quality-url]: https://www.bithound.io/github/webpack-contrib/purifycss-webpack From 5cf1a289f63d81a24fb0d4ff6a79606c5b004d7c Mon Sep 17 00:00:00 2001 From: Kenny Tran Date: Tue, 21 Feb 2017 10:19:03 -0800 Subject: [PATCH 130/168] Conform LICENSE with CLA prerequisites --- LICENSE | 20 ++++++++++++++++++++ LICENSE.md | 5 ----- 2 files changed, 20 insertions(+), 5 deletions(-) create mode 100644 LICENSE delete mode 100644 LICENSE.md diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..8c11fc7 --- /dev/null +++ b/LICENSE @@ -0,0 +1,20 @@ +Copyright JS Foundation and other contributors + +Permission is hereby granted, free of charge, to any person obtaining +a copy of this software and associated documentation files (the +'Software'), to deal in the Software without restriction, including +without limitation the rights to use, copy, modify, merge, publish, +distribute, sublicense, and/or sell copies of the Software, and to +permit persons to whom the Software is furnished to do so, subject to +the following conditions: + +The above copyright notice and this permission notice shall be +included in all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. +IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY +CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, +TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE +SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. diff --git a/LICENSE.md b/LICENSE.md deleted file mode 100644 index 73096ed..0000000 --- a/LICENSE.md +++ /dev/null @@ -1,5 +0,0 @@ -Copyright 2017 Kenny Tran - -Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies. - -THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. \ No newline at end of file From 61648ca429ddd2d2ae3a99370bebe79d468f2a94 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 24 Feb 2017 18:28:44 +0200 Subject: [PATCH 131/168] chore - Add `build:watch` target to speed up development --- package.json | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index fea14c2..bca5c90 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "main": "./dist", "scripts": { "build": "babel src -d dist", + "build:watch": "npm-watch", "test:all": "npm run test:coverage && npm run test:lint", "test": "jest --", "test:coverage": "jest --coverage --", @@ -65,10 +66,18 @@ "eslint-plugin-jsx-a11y": "^3.0.2", "eslint-plugin-react": "^6.9.0", "git-prepush-hook": "^1.0.1", - "jest": "^18.1.0" + "jest": "^18.1.0", + "npm-watch": "^0.1.8" }, "pre-push": [ "build", "test:all" - ] + ], + "watch": { + "build": { + "patterns": ["src"], + "extensions": "js", + "quiet": false + } + } } From 2843b118d0e62549969c25d175b9231e9418ea4c Mon Sep 17 00:00:00 2001 From: Siqi Tian Date: Mon, 27 Feb 2017 21:54:31 -0800 Subject: [PATCH 132/168] Fix chunk file match dependency on [name] --- src/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/index.js b/src/index.js index f4e6977..b28ed6e 100644 --- a/src/index.js +++ b/src/index.js @@ -31,11 +31,11 @@ module.exports = function PurifyPlugin(options) { compilation.plugin('additional-assets', (cb) => { // Go through chunks and purify as configured compilation.chunks.forEach( - ({ name: chunkName, modules }) => { + ({ name: chunkName, files, modules }) => { const assetsToPurify = search.assets( compilation.assets, options.styleExtensions ).filter( - asset => asset.name.indexOf(chunkName) >= 0 + asset => files.indexOf(asset.name) >= 0 ); output(() => [ From 26e64bb51c088f54f9534e490e8aaaf6fcb68b11 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Wed, 1 Mar 2017 19:43:55 +0200 Subject: [PATCH 133/168] chore - Add missing `npm install` --- examples/README.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/examples/README.md b/examples/README.md index 38f104a..daa6189 100644 --- a/examples/README.md +++ b/examples/README.md @@ -1,5 +1,6 @@ 1. `npm install` at project root 2. `npm run build` 3. `cd examples` -4. `npm run build` -5. Examine `./build` +4. `npm install` +5. `npm run build` +6. Examine `./build` From 542608cc1886259d05a2424fc7fca5ea93dd8a34 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Wed, 1 Mar 2017 19:49:12 +0200 Subject: [PATCH 134/168] Update changelog --- CHANGELOG.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 33b2c44..75ce13c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.4.3 / 2017-03-01 +================== + + * Bug fix - Fix chunk file match dependency on [name]. #86 + 0.4.2 / 2017-01-28 ================== From a43679decfd6efefbf5efb6b9f368cb88d2b7a38 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Wed, 1 Mar 2017 19:49:26 +0200 Subject: [PATCH 135/168] Update dist From 668818838061f7a49d871794b11cba346fe14c1a Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Wed, 1 Mar 2017 19:49:27 +0200 Subject: [PATCH 136/168] 0.4.3 --- package.json | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index bca5c90..05dad45 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.4.2", + "version": "0.4.3", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { @@ -75,7 +75,9 @@ ], "watch": { "build": { - "patterns": ["src"], + "patterns": [ + "src" + ], "extensions": "js", "quiet": false } From 497812c1629b6ccd50ae759feaef39b81f1b3667 Mon Sep 17 00:00:00 2001 From: Eric Skram Date: Wed, 1 Mar 2017 12:40:07 -0800 Subject: [PATCH 137/168] Update readme to include CSS modules support --- README.md | 36 ++++++++++++++++++++++++++++++++++++ 1 file changed, 36 insertions(+) diff --git a/README.md b/README.md index 9227908..654f0c2 100644 --- a/README.md +++ b/README.md @@ -81,6 +81,42 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su > The plugin does **not** emit sourcemaps even if you enable `sourceMap` option on loaders! +

Usage with CSS Modules

+ +PurifyCSS doesn't support classes that have been namespaced with CSS Modules. However, by adding a static string to `css-loader`'s `localIdentName`, you can effectively whitelist these namespaced classes. + +In this example, `PURIFY` will be our whitelisted string. **Note:** Make sure this string doesn't occur in any of your other CSS class names. Keep in mind that whatever you choose will end up in your application at runtime - try to keep it short! + +```javascript +module.exports = { + module: { + rules: [ + { + test: /\.css$/, + loader: ExtractTextPlugin.extract({ + fallback: 'style-loader', + use: [{ + loader: 'css-loader', + query: { + localIdentName: 'PURIFY_[hash:base64:5]', + modules: true + } + }] + }) + } + ] + }, + plugins: [ + ..., + new PurifyCSSPlugin({ + purifyOptions: { + whitelist: ['*PURIFY*'] + } + }) + ] +}; +``` +

Maintainers

From 3b04e3180a6b776e801708e3e608c38a09a3d6b0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Johannes=20Kronm=C3=BCller?= Date: Wed, 1 Mar 2017 22:16:33 +0100 Subject: [PATCH 138/168] feat - Add strict validation against `paths` --- src/index.js | 5 +++++ src/parse.js | 7 +++++++ 2 files changed, 12 insertions(+) diff --git a/src/index.js b/src/index.js index b28ed6e..3acdaaf 100644 --- a/src/index.js +++ b/src/index.js @@ -1,3 +1,4 @@ +import fs from 'fs'; import purify from 'purify-css'; import { ConcatSource } from 'webpack-sources'; import * as parse from './parse'; @@ -22,6 +23,10 @@ module.exports = function PurifyPlugin(options) { compiler.plugin('this-compilation', (compilation) => { const entryPaths = parse.entryPaths(options.paths); + parse.flatten(entryPaths).forEach((p) => { + if (!fs.existsSync(p)) throw new Error(`Path ${p} does not exist.`); + }); + // Output debug information through a callback pattern // to avoid unnecessary processing const output = options.verbose ? diff --git a/src/parse.js b/src/parse.js index 58ffee1..0797085 100644 --- a/src/parse.js +++ b/src/parse.js @@ -9,6 +9,12 @@ function parseEntryPaths(paths) { return ret; } +function flattenEntryPaths(paths) { + return Array.isArray(paths) ? + paths : + Object.keys(paths).reduce((acc, val) => [...acc, ...paths[val]], []); +} + function parseEntries(paths, chunkName) { if (Array.isArray(paths)) { return paths; @@ -25,5 +31,6 @@ function parseEntries(paths, chunkName) { module.exports = { entryPaths: parseEntryPaths, + flatten: flattenEntryPaths, entries: parseEntries }; From af315d61cb873b965acb5da5cf7d9a728f6a4ece Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 2 Mar 2017 08:35:39 +0200 Subject: [PATCH 139/168] chore - Improve formatting --- README.md | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 654f0c2..602d59f 100644 --- a/README.md +++ b/README.md @@ -95,13 +95,15 @@ module.exports = { test: /\.css$/, loader: ExtractTextPlugin.extract({ fallback: 'style-loader', - use: [{ - loader: 'css-loader', - query: { - localIdentName: 'PURIFY_[hash:base64:5]', - modules: true + use: [ + { + loader: 'css-loader', + options: { + localIdentName: 'PURIFY_[hash:base64:5]', + modules: true + } } - }] + ] }) } ] From 30b8f315063f8e511c67616876cf913ccdbc9794 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Johannes=20Kronm=C3=BCller?= Date: Thu, 2 Mar 2017 11:35:10 +0100 Subject: [PATCH 140/168] test - Add unit test for flattenEntryPaths helper --- src/parse.test.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/parse.test.js b/src/parse.test.js index 721df94..1b75d7e 100644 --- a/src/parse.test.js +++ b/src/parse.test.js @@ -19,6 +19,20 @@ describe('Parse entry paths', function () { }); }); +describe('Flatten entry paths', function () { + it('returns an array as itself', function () { + const a = ['a', 'b', 'c']; + + assert.deepEqual(parse.flatten(a), a); + }); + + it('returns an object of arrays as one flat array', function () { + const o = { a: ['a', 'b'], b: ['c', 'd'] }; + + assert.deepEqual(parse.flatten(o), ['a', 'b', 'c', 'd']); + }); +}); + describe('Parse entries', function () { it('returns paths if there is no chunk name', function () { const paths = ['a', 'b', 'c']; From ed133824099a735054e6433f46c39782f26aa87e Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 2 Mar 2017 12:44:25 +0200 Subject: [PATCH 141/168] chore - Update changelog --- CHANGELOG.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 75ce13c..137c0c0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.5.0 / 2017-03-02 +================== + + * Feature - Add strict validation against `paths`. #88 + 0.4.3 / 2017-03-01 ================== From e6266658887665102b703bb194c9bad6bf5e18db Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 2 Mar 2017 12:44:47 +0200 Subject: [PATCH 142/168] Update dist From 363029798db7c240d09af502bf0993df9291b156 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Thu, 2 Mar 2017 12:44:47 +0200 Subject: [PATCH 143/168] 0.5.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 05dad45..e75b2ea 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.4.3", + "version": "0.5.0", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From a0a208740b778eb6821b1222ba8b9bae29abe0c1 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 3 Mar 2017 19:42:23 +0200 Subject: [PATCH 144/168] chore - Rimraf the build --- package.json | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index e75b2ea..802721b 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { - "build": "babel src -d dist", + "build": "rimraf dist && babel src -d dist", "build:watch": "npm-watch", "test:all": "npm run test:coverage && npm run test:lint", "test": "jest --", @@ -67,7 +67,8 @@ "eslint-plugin-react": "^6.9.0", "git-prepush-hook": "^1.0.1", "jest": "^18.1.0", - "npm-watch": "^0.1.8" + "npm-watch": "^0.1.8", + "rimraf": "^2.6.1" }, "pre-push": [ "build", From bac04fb9d3dc535979c4000941ed3abea2111fcd Mon Sep 17 00:00:00 2001 From: IAMtheIAM Date: Wed, 5 Apr 2017 15:11:58 -0700 Subject: [PATCH 145/168] Allow purifycss-webpack to work with ExtractTextCssPlugin when hash is added to css file name. Example: [name].css?[hash] -> style.css?218aa9358a709a5a0a12 --- examples/webpack.parts.js | 2 +- src/search.js | 8 +++++++- 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/examples/webpack.parts.js b/examples/webpack.parts.js index f905fd6..4933b1f 100644 --- a/examples/webpack.parts.js +++ b/examples/webpack.parts.js @@ -16,7 +16,7 @@ exports.extractCSS = function extractCSS(paths) { ] }, plugins: [ - new ExtractTextPlugin('[name].css') + new ExtractTextPlugin('[name].css?[hash]') ] }; }; diff --git a/src/search.js b/src/search.js index cab74f4..dad4e3a 100644 --- a/src/search.js +++ b/src/search.js @@ -5,7 +5,13 @@ function searchAssets( extensions = [] ) { return Object.keys(assets).map( - name => extensions.indexOf(path.extname(name)) >= 0 && { name, asset: assets[name] } + name => { + var nameCleaned = name; + if (/\.(css\?).*$/.test(name)) { + nameCleaned = name.substr(0, name.lastIndexOf('?')); // ignore hash on file like style.css?7ec000f0d0d347 + } + extensions.indexOf(path.extname(nameCleaned)) >= 0 && { name, asset: assets[name] } + } ).filter(a => a); } From 8f69b514d880650e93c7b87ff04ba08a27b245d8 Mon Sep 17 00:00:00 2001 From: IAMtheIAM Date: Thu, 6 Apr 2017 11:24:55 -0700 Subject: [PATCH 146/168] Fix CI build, return value so test passes. --- src/search.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/search.js b/src/search.js index dad4e3a..1eb0feb 100644 --- a/src/search.js +++ b/src/search.js @@ -10,7 +10,7 @@ function searchAssets( if (/\.(css\?).*$/.test(name)) { nameCleaned = name.substr(0, name.lastIndexOf('?')); // ignore hash on file like style.css?7ec000f0d0d347 } - extensions.indexOf(path.extname(nameCleaned)) >= 0 && { name, asset: assets[name] } + return extensions.indexOf(path.extname(nameCleaned)) >= 0 && { name, asset: assets[name] } } ).filter(a => a); } From c0bd413b133c1b81c497ebd11efc9b0108e596db Mon Sep 17 00:00:00 2001 From: IAMtheIAM Date: Thu, 6 Apr 2017 11:32:02 -0700 Subject: [PATCH 147/168] Try again, Fix CI build, ES6 syntax fixes. --- src/search.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/search.js b/src/search.js index 1eb0feb..1ebc67a 100644 --- a/src/search.js +++ b/src/search.js @@ -5,12 +5,12 @@ function searchAssets( extensions = [] ) { return Object.keys(assets).map( - name => { - var nameCleaned = name; + (name) => { + let nameCleaned = name; if (/\.(css\?).*$/.test(name)) { nameCleaned = name.substr(0, name.lastIndexOf('?')); // ignore hash on file like style.css?7ec000f0d0d347 } - return extensions.indexOf(path.extname(nameCleaned)) >= 0 && { name, asset: assets[name] } + return extensions.indexOf(path.extname(nameCleaned)) >= 0 && { name, asset: assets[name] }; } ).filter(a => a); } From 4e0d68d2a395558ea096ffa6b4a61505d2d582cb Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 7 Apr 2017 10:41:07 +0200 Subject: [PATCH 148/168] chore: Simplify test commands --- package.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index 802721b..5cd5072 100644 --- a/package.json +++ b/package.json @@ -7,9 +7,9 @@ "build": "rimraf dist && babel src -d dist", "build:watch": "npm-watch", "test:all": "npm run test:coverage && npm run test:lint", - "test": "jest --", - "test:coverage": "jest --coverage --", - "test:watch": "jest --watch --", + "test": "jest", + "test:coverage": "jest --coverage", + "test:watch": "jest --watch", "test:lint": "eslint . --ext .js --ignore-path .gitignore --cache", "preversion": "npm run test:all && npm run build && git commit --allow-empty -am \"Update dist\"", "postinstall": "node lib/post_install.js" From 08b31b7807de3b677742c937769f64edd6be24e9 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 7 Apr 2017 10:50:38 +0200 Subject: [PATCH 149/168] feat: Generalize asset parsing to support general ? case --- src/search.js | 14 +++++++------- src/search.test.js | 11 +++++++++++ 2 files changed, 18 insertions(+), 7 deletions(-) diff --git a/src/search.js b/src/search.js index 1ebc67a..80d33e8 100644 --- a/src/search.js +++ b/src/search.js @@ -5,13 +5,13 @@ function searchAssets( extensions = [] ) { return Object.keys(assets).map( - (name) => { - let nameCleaned = name; - if (/\.(css\?).*$/.test(name)) { - nameCleaned = name.substr(0, name.lastIndexOf('?')); // ignore hash on file like style.css?7ec000f0d0d347 - } - return extensions.indexOf(path.extname(nameCleaned)) >= 0 && { name, asset: assets[name] }; - } + name => ( + extensions.indexOf( + path.extname( + name.indexOf('?') >= 0 ? name.split('?').slice(0, -1).join('') : name + ) + ) >= 0 && { name, asset: assets[name] } + ) ).filter(a => a); } diff --git a/src/search.test.js b/src/search.test.js index 512b7d7..a542091 100644 --- a/src/search.test.js +++ b/src/search.test.js @@ -16,6 +16,17 @@ describe('Search assets', function () { assert.deepEqual(search.assets(modules, extensions), matches); }); + + it('returns matches if they have query', function () { + const modules = { + 'foobar.txt?123': {}, + 'barbar.css': {} + }; + const extensions = ['.txt']; + const matches = [{ name: 'foobar.txt?123', asset: {} }]; + + assert.deepEqual(search.assets(modules, extensions), matches); + }); }); describe('Search files', function () { From 2a51af2463b2a9d5c6694e1a1a50cf1b6436356a Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 7 Apr 2017 10:51:57 +0200 Subject: [PATCH 150/168] chore: Update changelog --- CHANGELOG.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 137c0c0..0b08bee 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.6.0 / 2017-04-07 +================== + + * Feature - Allow asset names to contain `?`. Example: `style.css?218aa9358a709a5a0a12`. #94 + 0.5.0 / 2017-03-02 ================== From 1b1e7ca90b6d4ff63e76b71cbc2d1b725decdc4e Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 7 Apr 2017 10:56:32 +0200 Subject: [PATCH 151/168] Update dist From f1d2c1c69c33ecbe195b7bb9879f8f6e2fb51263 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 7 Apr 2017 10:56:33 +0200 Subject: [PATCH 152/168] 0.6.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 5cd5072..7e503dd 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.5.0", + "version": "0.6.0", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From 53c5ed1a1290b1a3034fc3488a9b0f786f0013d4 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 14 Apr 2017 06:20:27 +0200 Subject: [PATCH 153/168] docs: Fix CSS Modules example It needs to be lowercase to work properly. --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 602d59f..7051631 100644 --- a/README.md +++ b/README.md @@ -85,7 +85,7 @@ This plugin, unlike the original PurifyCSS plugin, provides special features, su PurifyCSS doesn't support classes that have been namespaced with CSS Modules. However, by adding a static string to `css-loader`'s `localIdentName`, you can effectively whitelist these namespaced classes. -In this example, `PURIFY` will be our whitelisted string. **Note:** Make sure this string doesn't occur in any of your other CSS class names. Keep in mind that whatever you choose will end up in your application at runtime - try to keep it short! +In this example, `purify` will be our whitelisted string. **Note:** Make sure this string doesn't occur in any of your other CSS class names. Keep in mind that whatever you choose will end up in your application at runtime - try to keep it short! ```javascript module.exports = { @@ -99,7 +99,7 @@ module.exports = { { loader: 'css-loader', options: { - localIdentName: 'PURIFY_[hash:base64:5]', + localIdentName: 'purify_[hash:base64:5]', modules: true } } @@ -112,7 +112,7 @@ module.exports = { ..., new PurifyCSSPlugin({ purifyOptions: { - whitelist: ['*PURIFY*'] + whitelist: ['*purify*'] } }) ] From f3d2ce1f23d6e17a490300a04be67e24c8e9db24 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 14 Apr 2017 06:22:05 +0200 Subject: [PATCH 154/168] chore: Update changelog --- CHANGELOG.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 0b08bee..e045e6c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.6.1 / 2017-04-14 +================== + + * Docs - Fix CSS Modules example (prefix has to be lowercase to work). + 0.6.0 / 2017-04-07 ================== From 4569a606289f3f7699f2efeeb958042ca53a36db Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 14 Apr 2017 06:22:23 +0200 Subject: [PATCH 155/168] Update dist From 7bd4b100bcc1350112d6e50b0172c63414c40508 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Fri, 14 Apr 2017 06:22:24 +0200 Subject: [PATCH 156/168] 0.6.1 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 7e503dd..7c0d2a6 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.6.0", + "version": "0.6.1", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From fd0af31435bb6f77cbdbdbf06051d06dd0e6a135 Mon Sep 17 00:00:00 2001 From: Jelmer Portegijs Date: Mon, 8 May 2017 16:59:52 +0200 Subject: [PATCH 157/168] Update README.md using glob-all (#105) --- README.md | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/README.md b/README.md index 7051631..9cf440b 100644 --- a/README.md +++ b/README.md @@ -64,6 +64,18 @@ module.exports = { And, that's it! Your scripts and view files will be scanned for classes, and those that are unused will be stripped off your CSS - aka. "purified". +In order to use this plugin to look into multiple paths you will need to: + +1. npm install --save glob-all +2. Add const glob = require('glob-all'); at the top of your webpack config +3. Then you can pass your paths to an array, like so: +``` +paths: glob.sync([ + path.join(__dirname, '.php'), + path.join(__dirname, 'partials/.php') +]), +``` + > You can pass an object (` -> []`) to `paths` if you want to control the behavior per entry.

Options

From 455159d4dd6442875931cfc7ad8530a8642ac35a Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 8 May 2017 18:00:35 +0300 Subject: [PATCH 158/168] chore: Update changelog --- CHANGELOG.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index e045e6c..cbe4e58 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.6.2 / 2017-05-08 +================== + + * Docs - Add **glob-all** example. #105 + 0.6.1 / 2017-04-14 ================== From 1e2c1796513d05e073e68d8c01680eca7163482c Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 8 May 2017 18:00:59 +0300 Subject: [PATCH 159/168] Update dist From 5f3daa54442a14728637951684af767371ca9eef Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 8 May 2017 18:00:59 +0300 Subject: [PATCH 160/168] 0.6.2 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 7c0d2a6..09ea50b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.6.1", + "version": "0.6.2", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From 4c0ba5ae52b69e035301523f484d8c19fddb7bea Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 8 May 2017 18:01:24 +0300 Subject: [PATCH 161/168] chore: Add syntax highlighting to an example --- README.md | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 9cf440b..ea40d87 100644 --- a/README.md +++ b/README.md @@ -69,10 +69,11 @@ In order to use this plugin to look into multiple paths you will need to: 1. npm install --save glob-all 2. Add const glob = require('glob-all'); at the top of your webpack config 3. Then you can pass your paths to an array, like so: -``` + +```javascript paths: glob.sync([ - path.join(__dirname, '.php'), - path.join(__dirname, 'partials/.php') + path.join(__dirname, '.php'), + path.join(__dirname, 'partials/.php') ]), ``` From 1585c35e11348a33ebe293c13aec080225a386aa Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Mon, 8 May 2017 18:02:01 +0300 Subject: [PATCH 162/168] chore: Add syntax highlighting --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index ea40d87..23653a2 100644 --- a/README.md +++ b/README.md @@ -67,7 +67,7 @@ And, that's it! Your scripts and view files will be scanned for classes, and tho In order to use this plugin to look into multiple paths you will need to: 1. npm install --save glob-all -2. Add const glob = require('glob-all'); at the top of your webpack config +2. Add `const glob = require('glob-all');` at the top of your webpack config 3. Then you can pass your paths to an array, like so: ```javascript From b846915cec52aa803e7d03b69eeac6a9760e8420 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 16 May 2017 17:45:06 +0300 Subject: [PATCH 163/168] breaking: Push **purify-css** as a peer dependency Related to #108. --- CHANGELOG.md | 5 +++++ README.md | 2 +- package.json | 4 ++-- 3 files changed, 8 insertions(+), 3 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index cbe4e58..05933b9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ ## purifycss-webpack +0.7.0 / 2017-05-16 +================== + + * Breaking - Push **purify-css** as a peer dependency. #108 + 0.6.2 / 2017-05-08 ================== diff --git a/README.md b/README.md index 23653a2..0921706 100644 --- a/README.md +++ b/README.md @@ -24,7 +24,7 @@ Without any CSS file being emitted as an asset, this plugin will do nothing. You

Install

```bash -npm i -D purifycss-webpack +npm i -D purifycss-webpack purify-css ```

Usage

diff --git a/package.json b/package.json index 09ea50b..3618d4f 100644 --- a/package.json +++ b/package.json @@ -45,11 +45,10 @@ }, "homepage": "https://github.com/webpack-contrib/purifycss-webpack", "peerDependencies": { - "webpack": "^1.9 || ^2.2.0 || ^2.1.0-beta || ^2.2.0-rc" + "purify-css": ">= 1.0.0 < 2.0.0" }, "dependencies": { "ajv": "^4.11.2", - "purify-css": "^1.1.9", "webpack-sources": "^0.1.4" }, "devDependencies": { @@ -68,6 +67,7 @@ "git-prepush-hook": "^1.0.1", "jest": "^18.1.0", "npm-watch": "^0.1.8", + "purify-css": "^1.2.2", "rimraf": "^2.6.1" }, "pre-push": [ From 3220fb5d35e1b200abd5b3e58cb1af73f38bba36 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 16 May 2017 17:45:35 +0300 Subject: [PATCH 164/168] Update dist From f223f3071eb2bbdd5b0da9b10178c5b47bb94ae7 Mon Sep 17 00:00:00 2001 From: Juho Vepsalainen Date: Tue, 16 May 2017 17:45:36 +0300 Subject: [PATCH 165/168] 0.7.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 3618d4f..bb6ddef 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "purifycss-webpack", - "version": "0.6.2", + "version": "0.7.0", "description": "PurifyCSS for webpack", "main": "./dist", "scripts": { From 408dfb0bcbdb002ad50217413432ab125df5ff77 Mon Sep 17 00:00:00 2001 From: Andrew Nesbitt Date: Tue, 19 Dec 2017 15:52:52 +0000 Subject: [PATCH 166/168] chore: Update license field in package.json to match LICENSE file (#128) MIT instead of ISC --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index bb6ddef..cee2a3e 100644 --- a/package.json +++ b/package.json @@ -39,7 +39,7 @@ ] }, "author": "Kenny Tran, Matthew Rourke, Phoebe Li, Kevin \"Ingwie Phoenix\" Ingwersen", - "license": "ISC", + "license": "MIT", "bugs": { "url": "https://github.com/webpack-contrib/purifycss-webpack/issues" }, From e5779f2981a21e8f55431e3548692c181f37d7b9 Mon Sep 17 00:00:00 2001 From: Evilebot Tnawi Date: Tue, 25 Dec 2018 17:58:50 +0300 Subject: [PATCH 167/168] Update README.md --- README.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/README.md b/README.md index 0921706..4541be4 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,8 @@ +UNMAINTAINED + +Please use: https://github.com/FullHuman/purgecss-webpack-plugin + +--- [![npm][npm]][npm-url] [![deps][deps]][deps-url] [![test][test]][test-url] From 476ad54301b08c02c9dc4e863221dd5b94428404 Mon Sep 17 00:00:00 2001 From: Evilebot Tnawi Date: Tue, 25 Dec 2018 17:59:08 +0300 Subject: [PATCH 168/168] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 4541be4..078fd07 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -UNMAINTAINED +# UNMAINTAINED Please use: https://github.com/FullHuman/purgecss-webpack-plugin