use webpack-node-externals for library build

Author: albertstill

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

@@ -13,6 +13,7 @@ const webpack = require('webpack');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const eslintFormatter = require('react-dev-utils/eslintFormatter');
 const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
+const nodeExternals = require('webpack-node-externals');
 const paths = require('./paths');
 const getClientEnvironment = require('./env');
 
@@ -82,7 +83,8 @@ module.exports = {
  // You can exclude the *.map files from the build during deployment.
  devtool: shouldUseSourceMap ? 'source-map' : false,
  // In production, we only want to load the polyfills and the app code.
- entry: [require.resolve('./polyfills'), paths.appIndexJs],
+ entry: [paths.appIndexJs],
+ target: 'node',
  output: {
  // The build folder.
  path: paths.appBuild,
@@ -299,6 +301,7 @@ module.exports = {
  // You can remove this if you don't use Moment.js:
  new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
  ],
+ externals: [nodeExternals()],
  // Some libraries import Node modules but don't use them in the browser.
  // Tell Webpack to provide empty mocks for them so importing them works.
  node: {

packages/react-scripts/package.json

@@ -61,6 +61,7 @@
  "webpack": "3.8.1",
  "webpack-dev-server": "2.9.4",
  "webpack-manifest-plugin": "1.3.2",
+ "webpack-node-externals": "^1.6.0",
  "whatwg-fetch": "2.0.3"
  },
  "devDependencies": {

packages/react-scripts/scripts/init.js

@@ -90,16 +90,18 @@ module.exports = function(
  );
 
  let command;
- let depArgs;
+ let peerDepArgs;
 
  if (useYarn) {
  command = 'yarnpkg';
- depArgs = ['add'];
+ peerDepArgs = ['add', '--save-dev'];
  } else {
  command = 'npm';
- depArgs = ['install', '--save', verbose && '--verbose'].filter(e => e);
+ peerDepArgs = ['install', '--save-dev', verbose && '--verbose'].filter(
+ e => e
+ );
  }
- depArgs.push('react', 'react-dom');
+ peerDepArgs.push('react', 'react-dom');
 
  // Install additional template dependencies, if present
  const templateDependenciesPath = path.join(
@@ -108,7 +110,7 @@ module.exports = function(
  );
  if (fs.existsSync(templateDependenciesPath)) {
  const templateDependencies = require(templateDependenciesPath).dependencies;
- depArgs = depArgs.concat(
+ peerDepArgs = peerDepArgs.concat(
  Object.keys(templateDependencies).map(key => {
  return `${key}@${templateDependencies[key]}`;
  })
@@ -123,9 +125,9 @@ module.exports = function(
  console.log(`Installing react and react-dom using ${command}...`);
  console.log();
 
- const proc = spawn.sync(command, depArgs, { stdio: 'inherit' });
+ const proc = spawn.sync(command, peerDepArgs, { stdio: 'inherit' });
  if (proc.status !== 0) {
- console.error(`\`${command} ${depArgs.join(' ')}\` failed`);
+ console.error(`\`${command} ${peerDepArgs.join(' ')}\` failed`);
  return;
  }
  }