Identify and group ModuleNotFound errors

As suggested in facebook/create-react-app#401

Author: geowarin

lib/webpack/plugins/formatMessage.js

@@ -7,39 +7,53 @@ function cleanStackTrace (message) {
 }
 
 function isBabelSyntaxError (e) {
-  // ModuleNotFoundError
-  // ModuleBuildError
   return e.name === 'ModuleBuildError' && e.message.indexOf('SyntaxError') >= 0;
 }
 
+function isModuleNotFoundError (e) {
+  return e.name === 'ModuleNotFoundError'
+    && e.message.indexOf('Module not found') === 0
+    && e.dependencies && e.dependencies.length;
+}
+
 function formatMessage (webpackError) {
 
   const error = extractError(webpackError);
   if (isBabelSyntaxError(webpackError)) {
     error.message = cleanStackTrace(error.message + '\n');
+    error.type = 'babel-syntax-error';
+    error.severity = 1000;
+  } else if (isModuleNotFoundError(webpackError)) {
+    error.message = `Module not found ${webpackError.dependencies[0].request}`;
+    error.module = webpackError.dependencies[0].request;
+    error.type = 'module-not-found';
+    error.severity = 900;
+  } else {
+    error.severity = 0;
   }
 
   return error;
 }
 
 function extractError (e) {
-  if (typeof e === "string") {
-    return {
-      message: e
-    };
-  }
+  return {
+    message: e.message,
+    file: getFile(e),
+    origin: getOrigin(e),
+    name: e.name
+  };
+}
 
-  // if (e.chunk) {
-  //   text += "chunk " + (e.chunk.name || e.chunk.id) +
-  //     (e.chunk.hasRuntime() ? " [entry]" : e.chunk.isInitial() ? " [initial]" : "") + "\n";
-  // }
-  let file = null;
+
+function getFile (e) {
   if (e.file) {
-    file = e.file;
+    return e.file;
   } else if (e.module && e.module.readableIdentifier && typeof e.module.readableIdentifier === "function") {
-    file = e.module.readableIdentifier(requestShortener);
+    return e.module.readableIdentifier(requestShortener);
   }
+}
 
+function getOrigin (e) {
   let origin = '';
   if (e.dependencies && e.origin) {
     origin += '\n @ ' + e.origin.readableIdentifier(requestShortener);
@@ -57,13 +71,7 @@ function extractError (e) {
       origin += '\n @ ' + current.readableIdentifier(requestShortener);
     }
   }
-
-  return {
-    message: e.message,
-    file,
-    origin,
-    name: e.name
-  };
+  return origin;
 }
 
 module.exports = formatMessage;

lib/webpack/plugins/notifier.js

@@ -53,7 +53,18 @@ class NotifierPlugin {
         if (this.notifier) {
           this.notify('Error', formattedErrors[0]);
         }
-        formattedErrors.forEach((error, index) => displayError(index, 'Error', error));
+
+        formattedErrors = getMaxSeverityErrors(formattedErrors, 'severity');
+        if (formattedErrors[0].type === 'module-not-found') {
+          console.log('These dependencies were not found in node_modules:');
+          console.log();
+          formattedErrors.forEach((error, index) => console.log('*', error.module));
+          console.log();
+          console.log('Did you forget to run npm install --save for them?')
+        } else {
+          formattedErrors.forEach((error, index) => displayError(index, 'Error', error));
+        }
+
         return;
       }
 
@@ -73,6 +84,17 @@ class NotifierPlugin {
   }
 }
 
+function getMaxSeverityErrors (errors) {
+  const maxSeverity = getMaxInt(errors, 'severity');
+  return errors.filter(e => e.severity === maxSeverity);
+}
+
+function getMaxInt(collection, propertyName) {
+  return collection.reduce((res, curr) => {
+    return curr[propertyName] > res ? curr[propertyName] : res;
+  }, 0)
+}
+
 module.exports = NotifierPlugin;
 
 function displayError (index, severity, error) {