Revamp CJS and ESM bundling with Rollup (extracted from #4261).

To create this commit, I (@benjamn) first squashed all of @rosskevin's
commits from PR #4261 into one big commit, then reverted any changes that
did not seem essential to the new bundling strategy discussed in that
PR. Once that was done, I rebased against origin/release-2.5.0 and fixed
the conflicts. With a few more minor tweaks, all tests are passing.

I will push a few additional changes after this commit, but I wanted to
preserve @rosskevin's intentions as much as possible here, since it still
has his name attached to the commit.

.gitignore

@@ -1,5 +1,6 @@
 # fs
 .DS_Store
+.rpt2_cache
 
 # Logs
 logs

.vscode/settings.json

@@ -7,6 +7,7 @@
   "files.exclude": {
     "**/.git": true,
     "**/.DS_Store": true,
+    "**/.rpt2_cache": true,
     "node_modules": true,
     "test-lib": true,
     "lib": true,

config/buildEsmConfig.js

@@ -0,0 +1,29 @@
+import nodeResolve from 'rollup-plugin-node-resolve';
+import typescriptPlugin from 'rollup-plugin-typescript2';
+import typescript from 'typescript';
+import path from 'path';
+
+// treat as externals not relative and not absolute paths
+const external = id => !id.startsWith('.') && !id.startsWith('/');
+
+const extensions = ['.ts', '.tsx'];
+const input = './src/index.ts';
+
+export default pkg => {
+  const projectDir = path.join(__filename, '..');
+  console.info(`Building project esm ${projectDir}`);
+  const tsconfig = `${projectDir}/tsconfig.json`;
+  return {
+    input,
+    external,
+    output: {
+      file: pkg.module,
+      format: 'esm',
+      sourcemap: true,
+    },
+    plugins: [
+      nodeResolve({ extensions }),
+      typescriptPlugin({ typescript, tsconfig }),
+    ],
+  };
+};

config/rollup.config.js → config/buildUmdConfig.js

@@ -1,5 +1,12 @@
-import node from 'rollup-plugin-node-resolve';
 import sourcemaps from 'rollup-plugin-sourcemaps';
+import nodeResolve from 'rollup-plugin-node-resolve';
+import typescriptPlugin from 'rollup-plugin-typescript2';
+import commonjs from 'rollup-plugin-commonjs';
+import typescript from 'typescript';
+import path from 'path';
+
+const extensions = ['.ts', '.tsx'];
+const input = './src/index.ts';
 
 export const globals = {
   // Apollo
@@ -13,13 +20,25 @@ export const globals = {
   'apollo-boost': 'apollo.boost',
 };
 
-export default (name, override = {}) => {
+const commonjsOptions = {
+  include: 'node_modules/**',
+};
+
+export default (name, override = { output: { globals: {} } }) => {
+  const projectDir = path.join(__filename, '..');
+  console.info(`Building project umd ${projectDir}`);
+  const tsconfig = `${projectDir}/tsconfig.json`;
   const config = Object.assign(
     {
-      input: 'lib/index.js',
+      input,
       //output: merged separately
       onwarn,
-      external: Object.keys(globals),
+      external: Object.keys({ ...globals, ...override.output.globals }),
+      plugins: [
+        nodeResolve({ extensions }),
+        typescriptPlugin({ typescript, tsconfig }),
+        commonjs(commonjsOptions),
+      ],
     },
     override,
   );
@@ -39,14 +58,15 @@ export default (name, override = {}) => {
   config.plugins = config.plugins || [];
   config.plugins.push(
     sourcemaps(),
-    node({
+    nodeResolve({
       // Inline anything imported from the tslib package, e.g. __extends
       // and __assign. This depends on the "importHelpers":true option in
       // tsconfig.base.json.
       module: true,
       only: ['tslib'],
     }),
   );
+
   return config;
 };
 

config/jest.config.settings.js

@@ -0,0 +1,21 @@
+module.exports = {
+  transform: {
+    '.(ts|tsx)': 'ts-jest',
+  },
+
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'json'],
+  testURL: 'http://localhost',
+
+  testMatch: ['<rootDir>/src/**/__tests__/*.ts'],
+  testPathIgnorePatterns: [
+    '/node_modules/',
+    '/lib/',
+    '<rootDir>/lib/',
+    // '<rootDir>/../*/lib/',
+  ],
+
+  // moduleNameMapper: {
+  //   '(apollo-boost|apollo-cache-inmemory|apollo-cache|apollo-client|apollo-utilities|graphql-anywhere)(.*)':
+  //     '<rootDir>/../$1/src/$2',
+  // },
+};

config/tsconfig.base.json

@@ -11,7 +11,7 @@
     "declaration": true,
     "declarationMap": true,
     "target": "es5",
-    "module": "es2015",
+    "module": "commonjs",
     "esModuleInterop": true
   }
 }

jest.config.js

@@ -0,0 +1,9 @@
+module.exports = {
+  rootDir: '.',
+  projects: ['<rootDir>/packages/*'],
+
+  // moduleNameMapper: {
+  //   '(apollo-boost|apollo-cache-inmemory|apollo-cache|apollo-client|apollo-utilities|graphql-anywhere)(.*)':
+  //     '<rootDir>/packages/$1/src/$2',
+  // },
+};

package.json

@@ -23,45 +23,25 @@
   "bundlesize": [
     {
       "name": "apollo-cache",
-      "path": "./packages/apollo-cache/lib/bundle.min.js",
+      "path": "./packages/apollo-cache/lib/bundle.umd.min.js",
       "maxSize": "900 B"
     },
     {
       "name": "apollo-cache-inmemory",
-      "path": "./packages/apollo-cache-inmemory/lib/bundle.min.js",
+      "path": "./packages/apollo-cache-inmemory/lib/bundle.umd.min.js",
       "maxSize": "6.2 kB"
     },
     {
       "name": "apollo-client",
-      "path": "./packages/apollo-client/lib/bundle.min.js",
+      "path": "./packages/apollo-client/lib/bundle.umd.min.js",
       "maxSize": "13 kB"
     },
     {
       "name": "apollo-utilities",
-      "path": "./packages/apollo-utilities/lib/bundle.min.js",
+      "path": "./packages/apollo-utilities/lib/bundle.umd.min.js",
       "maxSize": "4.75 kB"
     }
   ],
-  "jest": {
-    "transform": {
-      ".(ts|tsx)": "ts-jest"
-    },
-    "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",
-    "moduleFileExtensions": [
-      "ts",
-      "tsx",
-      "js",
-      "json"
-    ],
-    "modulePathIgnorePatterns": [
-      "/npm/"
-    ],
-    "testURL": "http://localhost",
-    "testPathIgnorePatterns": [
-      "/npm/",
-      "/node_modules/"
-    ]
-  },
   "lint-staged": {
     "*.ts*": [
       "prettier --ignore-path \"./config/prettierignore\" --trailing-comma all --single-quote --write"
@@ -109,17 +89,17 @@
     "react": "16.7.0",
     "react-dom": "16.7.0",
     "rollup": "1.1.2",
+    "rollup-plugin-commonjs": "9.2.0",
     "rollup-plugin-local-resolve": "1.0.7",
     "rollup-plugin-node-resolve": "4.0.0",
     "rollup-plugin-sourcemaps": "0.4.2",
+    "rollup-plugin-typescript2": "0.18.1",
     "rxjs": "6.4.0",
-    "ts-jest": "23.1.4",
+    "ts-jest": "23.10.5",
     "tslib": "^1.9.3",
     "tslint": "5.12.1",
     "typescript": "3.2.4",
-    "uglify-js": "3.4.9",
-    "webpack": "3.12.0",
-    "webpack-bundle-analyzer": "3.0.3"
+    "uglify-js": "3.4.9"
   },
   "renovate": {
     "extends": [

packages/apollo-boost/jest.config.js

@@ -0,0 +1,5 @@
+const pkg = require('../../config/jest.config.settings');
+
+module.exports = {
+  ...pkg,
+};

packages/apollo-boost/package.json

@@ -9,9 +9,9 @@
     "James Burgess <jamesmillerburgess@gmail.com>"
   ],
   "license": "MIT",
-  "main": "./lib/index.umd.js",
-  "module": "./lib/index.js",
-  "jsnext:main": "./lib/index.js",
+  "main": "./lib/index.js",
+  "module": "./lib/bundle.esm.js",
+  "browser": "./lib/bundle.umd.js",
   "typings": "./lib/index.d.ts",
   "sideEffects": false,
   "repository": {
@@ -28,14 +28,16 @@
     "coverage": "jest --coverage",
     "lint": "tslint -c \"../../config/tslint.json\" -p tsconfig.json src/*.ts",
     "prebuild": "npm run clean",
-    "build": "tsc -p .",
+    "build": "tsc -b .",
     "postbuild": "npm run bundle",
     "watch": "tsc -w -p .",
     "clean": "rm -rf coverage/* && rm -rf lib/*",
     "prepublishOnly": "npm run build",
-    "minify": "../../node_modules/uglify-js/bin/uglifyjs -c -m -o ./lib/bundle.min.js -- ./lib/bundle.umd.js",
+    "minify": "../../node_modules/uglify-js/bin/uglifyjs -c -m -o ./lib/bundle.umd.min.js -- ./lib/bundle.umd.js",
     "filesize": "npm run minify",
-    "bundle": "../../node_modules/rollup/bin/rollup -c rollup.config.js && ../../node_modules/rollup/bin/rollup -c rollup-bundle.config.js"
+    "clean:tests": "find ./lib -name \"__tests__\" -exec rm -rf '{}' +",
+    "bundle": "../../node_modules/rollup/bin/rollup -c rollup.config.js",
+    "postbundle": "npm run clean:tests"
   },
   "dependencies": {
     "apollo-cache": "file:../apollo-cache",
@@ -49,18 +51,5 @@
   },
   "peerDependencies": {
     "graphql": "^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0"
-  },
-  "jest": {
-    "transform": {
-      ".(ts|tsx)": "ts-jest"
-    },
-    "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",
-    "moduleFileExtensions": [
-      "ts",
-      "tsx",
-      "js",
-      "json"
-    ],
-    "testURL": "http://localhost"
   }
 }

packages/apollo-boost/rollup.config.js

@@ -1,4 +1,6 @@
-import build from '../../config/rollup.config';
+import buildUmdConfig from '../../config/buildUmdConfig';
+import buildEsmConfig from '../../config/buildEsmConfig';
+import pkg from './package.json';
 
 const globals = {
   'apollo-client': 'apollo.core',
@@ -9,10 +11,12 @@ const globals = {
   'graphql-tag': 'graphqlTag',
 };
 
-export default build('apollo.boost', {
-  external: Object.keys(global),
-  output: {
-    file: 'lib/index.umd.js',
-    globals,
-  },
-});
+export default [
+  buildUmdConfig('apollo.boost', {
+    external: Object.keys(globals),
+    output: {
+      globals,
+    },
+  }),
+  buildEsmConfig(pkg),
+];

packages/apollo-cache-inmemory/jest.config.js

@@ -0,0 +1,5 @@
+const pkg = require('../../config/jest.config.settings');
+
+module.exports = {
+  ...pkg,
+};

packages/apollo-cache-inmemory/package.json

@@ -11,9 +11,9 @@
     "Bazyli Brzóska <bazyli.brzoska@gmail.com>"
   ],
   "license": "MIT",
-  "main": "./lib/bundle.umd.js",
-  "module": "./lib/index.js",
-  "jsnext:main": "./lib/index.js",
+  "main": "./lib/index.js",
+  "module": "./lib/bundle.esm.js",
+  "browser": "./lib/bundle.umd.js",
   "typings": "./lib/index.d.ts",
   "sideEffects": [
     "./lib/fixPolyfills.js"
@@ -32,13 +32,15 @@
     "test": "jest",
     "lint": "tslint -c \"../../config/tslint.json\" -p tsconfig.json src/*.ts",
     "prebuild": "npm run clean",
-    "build": "tsc -p .",
+    "build": "tsc -b .",
     "postbuild": "npm run bundle",
+    "clean:tests": "find ./lib -name \"__tests__\" -exec rm -rf '{}' +",
     "bundle": "../../node_modules/rollup/bin/rollup -c rollup.config.js",
+    "postbundle": "npm run clean:tests",
     "watch": "tsc -w -p .",
     "clean": "rm -rf coverage/* && rm -rf lib/*",
     "prepublishOnly": "npm run build",
-    "minify": "../../node_modules/uglify-js/bin/uglifyjs -c -m -o ./lib/bundle.min.js -- ./lib/bundle.umd.js",
+    "minify": "../../node_modules/uglify-js/bin/uglifyjs -c -m -o ./lib/bundle.umd.min.js -- ./lib/bundle.umd.js",
     "filesize": "npm run minify"
   },
   "dependencies": {
@@ -49,18 +51,5 @@
   },
   "peerDependencies": {
     "graphql": "0.11.7 || ^0.12.0 || ^0.13.0 || ^14.0.0"
-  },
-  "jest": {
-    "transform": {
-      ".(ts|tsx)": "ts-jest"
-    },
-    "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",
-    "moduleFileExtensions": [
-      "ts",
-      "tsx",
-      "js",
-      "json"
-    ],
-    "testURL": "http://localhost"
   }
 }