Update to PostCSS 8

index.js

@@ -3,18 +3,13 @@
 const { validateArguments } = require("@validatem/core");
 const ValidationError = require("@validatem/error");
 const isBoolean = require("@validatem/is-boolean");
+const isPostcssPlugin = require("@validatem/is-postcss-plugin");
 const isString = require("@validatem/is-string");
 const required = require("@validatem/required");
 const arrayOf = require("@validatem/array-of");
 const oneOf = require("@validatem/one-of");
 const allowExtraProperties = require("@validatem/allow-extra-properties");
 
-function isPostcssPlugin(value) {
-	if (value.postcssPlugin == null || value.postcssVersion == null || typeof value !== "function") {
-		throw new ValidationError(`Must be a PostCSS plugin`);
-	}
-}
-
 // FIXME: When there's >1 icssify instance set up on the Browserify instance (can this happen when a module specifies its own dependency on icssify?), either throw an error (if incompatible?) or merge the two somehow, so that there's only one resulting .css file
 
 module.exports = function (browserify, options) {

package.json

@@ -27,6 +27,7 @@
     "@validatem/core": "^0.3.15",
     "@validatem/error": "^1.1.0",
     "@validatem/is-boolean": "^0.1.1",
+    "@validatem/is-postcss-plugin": "^0.2.0",
     "@validatem/is-string": "^1.0.0",
     "@validatem/one-of": "^0.1.1",
     "@validatem/required": "^0.1.1",
@@ -39,15 +40,18 @@
     "insert-css": "^2.0.0",
     "map-obj": "^4.1.0",
     "object.fromentries": "^2.0.1",
-    "postcss": "^6.0.9",
-    "postcss-modules-extract-imports": "^2.0.0",
-    "postcss-modules-local-by-default": "^3.0.2",
-    "postcss-modules-scope": "^2.1.0",
-    "postcss-modules-values": "^3.0.0",
+    "postcss-modules-extract-imports": "^3.0.0",
+    "postcss-modules-local-by-default": "^4.0.0",
+    "postcss-modules-scope": "^3.0.0",
+    "postcss-modules-values": "^4.0.0",
     "through2": "^2.0.3"
   },
   "devDependencies": {
     "@joepie91/eslint-config": "^1.1.0",
-    "eslint": "^6.8.0"
+    "eslint": "^6.8.0",
+    "postcss": "^8.0.0"
+  },
+  "peeerDependencies": {
+    "postcss": "^8.0.0"
   }
 }

src/postcss/postcss-icss-find-imports.js

@@ -11,14 +11,15 @@ Licensed under:
 	MIT (https://opensource.org/licenses/MIT)
 */
 
-const postcss = require("postcss");
 const icssUtils = require("icss-utils");
 const loaderUtils = require("loader-utils");
 
 const pluginName = 'postcss-icss-find-imports';
 
-module.exports = postcss.plugin(pluginName, (_options = {}) => {
-	return function process(css, result) {
+module.exports = (_options = {}) => {
+	return {
+		postcssPlugin: pluginName,
+		Once(root, { result }) {
 			let discoveredImports = new Set();
 
 			let { icssImports } = icssUtils.extractICSS(css, false);
@@ -34,5 +35,8 @@ module.exports = postcss.plugin(pluginName, (_options = {}) => {
 					url: url
 				});
 			}
+		},
 	};
-});
+};
+
+module.exports.postcss = true;

src/postcss/postcss-icss-parser.js

@@ -11,7 +11,6 @@ Licensed under:
 	MIT (https://opensource.org/licenses/MIT)
 */
 
-const postcss = require("postcss");
 const icssUtils = require("icss-utils");
 const loaderUtils = require("loader-utils");
 const { validateOptions } = require("@validatem/core");
@@ -21,13 +20,15 @@ const isFunction = require("@validatem/is-function");
 
 const pluginName = 'postcss-icss-parser';
 
-module.exports = postcss.plugin(pluginName, (options = {}) => {
+module.exports = (options = {}) => {
 	validateOptions([options], {
 		keyReplacer: [ required, isFunction ],
 		autoExportImports: [ isBoolean ]
 	});
 
-	return function process(css, result) {
+	return {
+		postcssPlugin: pluginName,
+		Once(css, { result }) {
 			const importReplacements = Object.create(null);
 			const { icssImports, icssExports } = icssUtils.extractICSS(css);
 
@@ -76,5 +77,8 @@ module.exports = postcss.plugin(pluginName, (options = {}) => {
 					item: { name, value: parsedValue }
 				});
 			}
+		},
 	};
-});
+};
+
+module.exports.postcss = true;