build: adds umd and system build targets (#80)

Summary:

- Adds umd and system build targets

- Makes umd + system builds work correctly with dependencies

- Upgraded rollup and various plugins to the latest versions; otherwise the build wouldn't work because of various cjs interop issues

Co-authored-by: Matt Carroll <[email protected]>

Author: frehner

package.json

@@ -38,6 +38,9 @@
     "react": ">=16.8.0"
   },
   "devDependencies": {
+    "@rollup/plugin-commonjs": "^16.0.0",
+    "@rollup/plugin-node-resolve": "^10.0.0",
+    "@rollup/plugin-replace": "^2.3.4",
     "@types/enzyme": "^3.1.15",
     "@types/enzyme-adapter-react-16": "^1.0.3",
     "@types/hoist-non-react-statics": "^3.3.1",
@@ -58,11 +61,8 @@
     "prettier": "1.19.1",
     "react": "^16.8.0",
     "react-dom": "^16.8.0",
-    "rollup": "^1.1.0",
-    "rollup-plugin-commonjs": "^9.2.0",
-    "rollup-plugin-node-resolve": "^4.0.0",
-    "rollup-plugin-replace": "^2.1.0",
-    "rollup-plugin-typescript2": "^0.18.1",
+    "rollup": "^2.32.1",
+    "rollup-plugin-typescript2": "^0.28.0",
     "rollup-plugin-uglify": "^6.0.4",
     "ts-jest": "^26.4.1",
     "tslib": "^1.9.3",

scripts/build.js

@@ -37,3 +37,11 @@ exec(`./node_modules/.bin/rollup -c scripts/config.js -f es -o dist/${packageNam
 console.log("\nBuilding CommonJS modules...");
 
 exec(`./node_modules/.bin/rollup -c scripts/config.js -f cjs -o dist/${packageName}.js`);
+
+console.log("\nBuilding UMD modules...");
+
+exec(`./node_modules/.bin/rollup -c scripts/config.js -f umd -o dist/${packageName}.umd.js --name ${umdName}`, {EXTERNALS: 'forBrowsers', BUILD_ENV: 'production' });
+
+console.log("\nBuilding SystemJS modules...");
+
+exec(`./node_modules/.bin/rollup -c scripts/config.js -f system -o dist/${packageName}.system.js`, {EXTERNALS: 'forBrowsers', BUILD_ENV: 'production' });

scripts/config.js

@@ -15,26 +15,30 @@
  */
 
 const typescript = require('rollup-plugin-typescript2')
-const commonjs = require('rollup-plugin-commonjs')
-const replace = require('rollup-plugin-replace')
-const resolve = require('rollup-plugin-node-resolve')
+const commonjs = require('@rollup/plugin-commonjs')
+const replace = require('@rollup/plugin-replace')
+const { nodeResolve } = require('@rollup/plugin-node-resolve')
 const { uglify } = require('rollup-plugin-uglify')
 
 const packageDeps = require('../package.json').dependencies || {}
 const packagePeers = require('../package.json').peerDependencies || {}
 
 function getExternals(externals) {
+  if(externals === 'forBrowsers') {
+    return ['react']
+  }
   return externals === 'peers'
     ? Object.keys(packagePeers)
     : Object.keys(packageDeps).concat(Object.keys(packagePeers))
 }
 
-function getPlugins(env) {
+function getPlugins(env, externals) {
   const plugins = [
-    resolve(),
+    nodeResolve({
+      browser: externals === 'forBrowsers',
+    }),
     commonjs({
       include: /node_modules/,
-      namedExports: { '@optimizely/js-sdk-logging': ['getLogger'] },
     }),
   ]
 
@@ -63,7 +67,7 @@ const config = {
     },
   },
   external: getExternals(process.env.EXTERNALS),
-  plugins: getPlugins(process.env.BUILD_ENV),
+  plugins: getPlugins(process.env.BUILD_ENV, process.env.EXTERNALS),
 }
 
 module.exports = config