Fix: remove webpack 4 deprecation warning

bin/styleguidist.js

@@ -107,13 +107,21 @@ function commandBuild() {
 	verbose('Webpack config:', compiler.options);
 
 	// Custom error reporting
-	compiler.plugin('done', function(stats) {
+	function customErrorBuild(stats) {
 		const messages = formatWebpackMessages(stats.toJson({}, true));
 		const hasErrors = printAllErrorsAndWarnings(messages, stats.compilation);
 		if (hasErrors) {
 			process.exit(1);
 		}
-	});
+	}
+
+	if (compiler.hooks) {
+		// webpack 4
+		compiler.hooks.done.tap('rsgCustomErrorBuild', customErrorBuild);
+	} else {
+		// webpack 3
+		compiler.plugin('done', customErrorBuild);
+	}
 }
 
 function commandServer() {
@@ -146,13 +154,13 @@ function commandServer() {
 	verbose('Webpack config:', compiler.options);
 
 	// Show message when webpack is recompiling the bundle
-	compiler.plugin('invalid', function() {
+	function invalidServer() {
 		console.log();
 		spinner = ora('Compiling...').start();
-	});
+	}
 
 	// Custom error reporting
-	compiler.plugin('done', function(stats) {
+	function customErrorServer(stats) {
 		if (spinner) {
 			spinner.stop();
 		}
@@ -164,7 +172,17 @@ function commandServer() {
 		}
 
 		printAllErrorsAndWarnings(messages, stats.compilation);
-	});
+	}
+
+	if (compiler.hooks) {
+		// webpack 4
+		compiler.hooks.invalid.tap('rsgInvalidServer', invalidServer);
+		compiler.hooks.done.tap('rsgCustomErrorServer', customErrorServer);
+	} else {
+		// webpack 3
+		compiler.plugin('invalid', invalidServer);
+		compiler.plugin('done', customErrorServer);
+	}
 }
 
 function commandHelp() {

scripts/utils/StyleguidistOptionsPlugin.js

@@ -11,12 +11,19 @@ class StyleguidistOptionsPlugin {
 	}
 
 	plugin(compilation) {
-		compilation.plugin('normal-module-loader', (context, module) => {
+		const pluginFunc = (context, module) => {
 			if (!module.resource) {
 				return;
 			}
 			context._styleguidist = this.options;
-		});
+		};
+		if (compilation.hooks) {
+			// Webpack 4
+			compilation.hooks.normalModuleLoader.tap('StyleguidistOptionsPlugin', pluginFunc);
+		} else {
+			// Webpack 3
+			compilation.plugin('normal-module-loader', pluginFunc);
+		}
 	}
 
 	apply(compiler) {

scripts/utils/__tests__/StyleguidistOptionsPlugin.spec.js

@@ -21,6 +21,31 @@ it('should attach Styleguidist config object to webpack context', () => {
 	expect(context._styleguidist).toEqual(options);
 });
 
+it('should attach Styleguidist config when webpack 4 is used', () => {
+	const context = {};
+	const compiler = {
+		hooks: {
+			compilation: {
+				tap: (name, callback) => {
+					callback({
+						hooks: {
+							normalModuleLoader: {
+								tap: (name, compilationCallback) => {
+									compilationCallback(context, { resource: 'pizza' });
+								},
+							},
+						},
+					});
+				},
+			},
+		},
+	};
+	const plugin = new StyleguidistOptionsPlugin(options);
+	plugin.apply(compiler);
+
+	expect(context._styleguidist).toEqual(options);
+});
+
 it('should do nothing when resource is empty', () => {
 	const context = {};
 	const compiler = {