Warn about duplicate dependencies

packages/react-scripts/config/webpack.config.dev.js

@@ -16,6 +16,7 @@ var HtmlWebpackPlugin = require('html-webpack-plugin');
 var CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
 var InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
 var WatchMissingNodeModulesPlugin = require('react-dev-utils/WatchMissingNodeModulesPlugin');
+var DuplicatePackageCheckerPlugin = require('duplicate-package-checker-webpack-plugin');
 var getClientEnvironment = require('./env');
 var paths = require('./paths');
 
@@ -228,6 +229,9 @@ module.exports = {
     // a plugin that prints an error when you attempt to do this.
     // See https://github.com/facebookincubator/create-react-app/issues/240
     new CaseSensitivePathsPlugin(),
+    // Warn about duplicate dependencies.
+    // See https://github.com/facebookincubator/create-react-app/issues/1844
+    new DuplicatePackageCheckerPlugin(),
     // If you require a missing module and then `npm install` it, you still have
     // to restart the development server for Webpack to discover it. This plugin
     // makes the discovery automatic so you don't have to restart.

packages/react-scripts/config/webpack.config.prod.js

@@ -16,6 +16,7 @@ var HtmlWebpackPlugin = require('html-webpack-plugin');
 var ExtractTextPlugin = require('extract-text-webpack-plugin');
 var ManifestPlugin = require('webpack-manifest-plugin');
 var InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
+var DuplicatePackageCheckerPlugin = require('duplicate-package-checker-webpack-plugin');
 var paths = require('./paths');
 var getClientEnvironment = require('./env');
 
@@ -263,6 +264,9 @@ module.exports = {
         screw_ie8: true
       }
     }),
+    // Warn about duplicate dependencies.
+    // See https://github.com/facebookincubator/create-react-app/issues/1844
+    new DuplicatePackageCheckerPlugin(),
     // Note: this won't work without ExtractTextPlugin.extract(..) in `loaders`.
     new ExtractTextPlugin(cssFilename),
     // Generate a manifest file which contains a mapping of all asset filenames

packages/react-scripts/package.json

@@ -37,6 +37,7 @@
     "css-loader": "0.26.1",
     "detect-port": "1.1.1",
     "dotenv": "2.0.0",
+    "duplicate-package-checker-webpack-plugin": "^1.2.4",
     "eslint": "3.16.1",
     "eslint-config-react-app": "^0.6.2",
     "eslint-loader": "1.6.0",

packages/react-scripts/scripts/build.js

@@ -62,6 +62,15 @@ function printErrors(summary, errors) {
   });
 }
 
+function printWarnings(summary, warnings) {
+  console.log(chalk.yellow(summary));
+  console.log();
+  warnings.forEach(err => {
+    console.log(err.message || err);
+    console.log();
+  });
+}
+
 // Create the production build and print the deployment instructions.
 function build(previousFileSizes) {
   console.log('Creating an optimized production build...');
@@ -77,12 +86,17 @@ function build(previousFileSizes) {
     }
 
     if (process.env.CI && stats.compilation.warnings.length) {
-     printErrors('Failed to compile. When process.env.CI = true, warnings are treated as failures. Most CI servers set this automatically.', stats.compilation.warnings);
-     process.exit(1);
-   }
+      printErrors('Failed to compile. When process.env.CI = true, warnings are treated as failures. Most CI servers set this automatically.', stats.compilation.warnings);
+      process.exit(1);
+    }
 
-    console.log(chalk.green('Compiled successfully.'));
-    console.log();
+    if (stats.compilation.warnings.length) {
+      console.log();
+      printWarnings('Compiled with warnings.', stats.compilation.warnings);
+    } else {
+      console.log(chalk.green('Compiled successfully.'));
+      console.log();
+    }
 
     console.log('File sizes after gzip:');
     console.log();