Externalize peerDependency in Webpack

webpack.config.js

function getPeerDependencies() {
  const pkgPath = path.join(process.cwd(), "./package.json");
  const pkgJSON = JSON.parse(readFileSync(pkgPath));
  const peerDependencies =
    pkgJSON.peerDependencies !== undefined
      ? Object.keys(pkgJSON.peerDependencies)
      : [];
  return peerDependencies;
}

/**
 * Considering UMD output target for Webpack
 */
function getExternals() {
  const externalsDependencies = getPeerDependencies();
  const externalsDictionary = {
    // Ref: https://webpack.js.org/configuration/externals/#object
    // Ref: https://github.com/webpack/webpack/issues/1275#issuecomment-245990108
    react: {
      root: "React",
      commonjs: "react",
      commonjs2: "react",
      amd: "react",
    },
    "react-dom": {
      root: "ReactDOM",
      commonjs: "react-dom",
      commonjs2: "react-dom",
      amd: "react-dom",
    },
    "@material-ui/core": {
      root: "MaterialUI",
      commonjs: "@material-ui/core",
      commonjs2: "@material-ui/core",
      amd: "@material-ui/core",
    },
  };
  let externals = {};
  for (let i = 0; i < externalsDependencies.length; i += 1) {
    if (externalsDependencies[i] in externalsDictionary) {
      externals = {
        ...externals,
        [externalsDependencies[i]]:
          externalsDictionary[externalsDependencies[i]],
      };
    }
  }
  return externals;
}

// Webpack config:

module.exports = (env) => {
  
  // do whatever with your config
  let config = {...};
  
  // Externalize peerDependencies (assuming UMD output target)
  config = {...config, externals: {...config.externals, ...getExternals()};
  
  return config;
}