feat(react): add support for rollup in bundles

packages/react/package.json

@@ -24,7 +24,7 @@
  "access": "public"
  },
  "scripts": {
- "build": "yarn clean && node scripts/build.js",
+ "build": "yarn clean && node scripts/build.js && rollup -c",
  "build-storybook": "cross-env NODE_ENV=production build-storybook",
  "clean": "rimraf es lib umd storybook-static build react-docgen.json",
  "prepublish": "yarn build",
@@ -107,6 +107,7 @@
  "rollup-plugin-node-resolve": "^4.2.3",
  "rollup-plugin-replace": "^2.2.0",
  "rollup-plugin-sizes": "^0.5.0",
+ "rollup-plugin-strip-banner": "^1.0.0",
  "rollup-plugin-terser": "^4.0.0",
  "rtlcss": "^2.4.0",
  "sass-loader": "^8.0.2",

packages/react/rollup.config.js

@@ -0,0 +1,146 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+const babel = require('rollup-plugin-babel');
+const commonjs = require('rollup-plugin-commonjs');
+const resolve = require('rollup-plugin-node-resolve');
+const replace = require('rollup-plugin-replace');
+const stripBanner = require('rollup-plugin-strip-banner');
+const { terser } = require('rollup-plugin-terser');
+const packageJson = require('./package.json');
+
+const baseConfig = {
+ input: './src/index.js',
+ external: [
+ ...Object.keys(packageJson.peerDependencies),
+ ...Object.keys(packageJson.dependencies),
+ 'prop-types',
+ ],
+ plugins: [
+ resolve(),
+ commonjs({
+ include: /node_modules/,
+ namedExports: {
+ 'react/index.js': [
+ 'Children',
+ 'Component',
+ 'PureComponent',
+ 'Fragment',
+ 'PropTypes',
+ 'createElement',
+ ],
+ 'react-dom/index.js': ['render'],
+ 'react-is/index.js': ['isForwardRef'],
+ },
+ }),
+ babel({
+ babelrc: false,
+ exclude: ['node_modules/**'],
+ presets: [
+ [
+ '@babel/preset-env',
+ {
+ modules: false,
+ targets: {
+ browsers: ['extends browserslist-config-carbon'],
+ },
+ },
+ ],
+ '@babel/preset-react',
+ ],
+ plugins: [
+ 'dev-expression',
+ '@babel/plugin-syntax-dynamic-import',
+ '@babel/plugin-syntax-import-meta',
+ '@babel/plugin-proposal-class-properties',
+ '@babel/plugin-proposal-export-namespace-from',
+ '@babel/plugin-proposal-export-default-from',
+ ],
+ }),
+ stripBanner(),
+ ],
+};
+
+const umdExternalDependencies = Object.keys(
+ packageJson.peerDependencies
+).filter(dependency => dependency !== 'carbon-components');
+
+const umdBundleConfig = {
+ input: baseConfig.input,
+ external: [...umdExternalDependencies, 'prop-types'],
+ output: {
+ name: 'CarbonComponentsReact',
+ format: 'umd',
+ globals: {
+ classnames: 'classNames',
+ 'prop-types': 'PropTypes',
+ react: 'React',
+ 'react-dom': 'ReactDOM',
+ 'carbon-icons': 'CarbonIcons',
+ },
+ },
+};
+
+module.exports = [
+ // Generates the following bundles:
+ // ESM: es/index.js
+ // CommonJS: lib/index.js
+ {
+ ...baseConfig,
+ plugins: [
+ ...baseConfig.plugins,
+ replace({
+ 'process.env.NODE_ENV': JSON.stringify('development'),
+ }),
+ ],
+ output: [
+ {
+ format: 'esm',
+ file: 'es/index.js',
+ },
+ {
+ format: 'cjs',
+ file: 'lib/index.js',
+ },
+ ],
+ },
+
+ // Generate the development UMD bundle:
+ // UMD: umd/carbon-components-react.js
+ {
+ ...umdBundleConfig,
+ plugins: [
+ ...baseConfig.plugins,
+ replace({
+ 'process.env.NODE_ENV': JSON.stringify('development'),
+ }),
+ ],
+ output: {
+ ...umdBundleConfig.output,
+ file: 'umd/carbon-components-react.js',
+ },
+ },
+
+ // Generate the production UMD bundle:
+ // UMD: umd/carbon-components-react.min.js
+ {
+ ...umdBundleConfig,
+ plugins: [
+ ...baseConfig.plugins,
+ replace({
+ 'process.env.NODE_ENV': JSON.stringify('production'),
+ }),
+ terser(),
+ ],
+ output: {
+ ...umdBundleConfig.output,
+ file: 'umd/carbon-components-react.min.js',
+ },
+ },
+];

packages/react/scripts/build.js

@@ -13,9 +13,6 @@ if (inInstall()) {
 const babelPath = path
  .resolve(__dirname, '../node_modules/.bin/babel')
  .replace(/ /g, '\\ ');
-const rollupPath = path
- .resolve(__dirname, '../node_modules/.bin/rollup')
- .replace(/ /g, '\\ ');
 
 const exec = (command, extraEnv) =>
  execSync(command, {
@@ -43,19 +40,6 @@ try {
  'react-docgen.json',
  JSON.stringify(mapValues(require(`../build/docgen`), '__docgenInfo'))
  );
-
- exec(
- `${rollupPath} -c scripts/rollup.config.js -o umd/carbon-components-react.js`,
- {
- NODE_ENV: 'development',
- }
- );
- exec(
- `${rollupPath} -c scripts/rollup.config.js -o umd/carbon-components-react.min.js`,
- {
- NODE_ENV: 'production',
- }
- );
 } catch (error) {
  console.error('One of the commands failed:', error.stack); // eslint-disable-line no-console
  process.exit(1);

yarn.lock

@@ -14665,6 +14665,13 @@ magic-string@0.19.1:
  dependencies:
  vlq "^0.2.1"
 
+magic-string@0.25.4:
+ version "0.25.4"
+ resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.4.tgz#325b8a0a79fc423db109b77fd5a19183b7ba5143"
+ integrity sha512-oycWO9nEVAP2RVPbIoDoA4Y7LFIJ3xRYov93gAyJhZkET1tNuB0u7uWkZS2LpBWTJUWnmau/To8ECWRC+jKNfw==
+ dependencies:
+ sourcemap-codec "^1.4.4"
+
 magic-string@^0.25.2:
  version "0.25.6"
  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.6.tgz#5586387d1242f919c6d223579cc938bf1420795e"
@@ -19504,6 +19511,15 @@ rollup-plugin-strip-banner@^0.2.0:
  magic-string "0.19.1"
  rollup-pluginutils "2.0.1"
 
+rollup-plugin-strip-banner@^1.0.0:
+ version "1.0.0"
+ resolved "https://registry.yarnpkg.com/rollup-plugin-strip-banner/-/rollup-plugin-strip-banner-1.0.0.tgz#28ddfb74e7b9c1fe3e612124fa83e571b914e893"
+ integrity sha512-hatiuCbYCM7db/JmogCn5a4/Un5dLnAIT4ixXmH9qNCbzXJqd0/jnVd/8ZDA3fF7WmmVh7D18GAzha0MMmRpSQ==
+ dependencies:
+ extract-banner "0.1.2"
+ magic-string "0.25.4"
+ rollup-pluginutils "2.8.2"
+
 rollup-plugin-terser@^4.0.0:
  version "4.0.4"
  resolved "https://registry.yarnpkg.com/rollup-plugin-terser/-/rollup-plugin-terser-4.0.4.tgz#6f661ef284fa7c27963d242601691dc3d23f994e"
@@ -19527,6 +19543,13 @@ rollup-pluginutils@2.0.1:
  estree-walker "^0.3.0"
  micromatch "^2.3.11"
 
+rollup-pluginutils@2.8.2:
+ version "2.8.2"
+ resolved "https://registry.yarnpkg.com/rollup-pluginutils/-/rollup-pluginutils-2.8.2.tgz#72f2af0748b592364dbd3389e600e5a9444a351e"
+ integrity sha512-EEp9NhnUkwY8aif6bxgovPHMoMoNr2FulJziTndpt5H9RdwC47GSGuII9XxpSdzVGM0GWrNPHV6ie1LTNJPaLQ==
+ dependencies:
+ estree-walker "^0.6.1"
+
 rollup-pluginutils@^2.6.0, rollup-pluginutils@^2.8.1:
  version "2.8.2"
  resolved "https://registry.yarnpkg.com/rollup-pluginutils/-/rollup-pluginutils-2.8.2.tgz#72f2af0748b592364dbd3389e600e5a9444a351e"