diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0b484e06013..67b0153053a 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,9 @@
## Apollo Client (vNEXT)
+- In all Apollo Client packages, the compilation of `lib/bundle.esm.js` to `lib/bundle.cjs.js` and `lib/bundle.umd.js` now uses Babel instead of Rollup, since Babel correctly compiles some [edge cases](https://github.com/apollographql/apollo-client/issues/4843#issuecomment-495717720) that neither Rollup nor TypeScript compile correctly.
+ [@benjamn](https://github.com/benjamn) in [#4911](https://github.com/apollographql/apollo-client/pull/4911)
+
### Apollo Cache In-Memory
- Pretend that `__typename` exists on the root Query when matching fragments.
diff --git a/config/rollup.config.js b/config/rollup.config.js
index a0dda885253..e3a1a16bf40 100644
--- a/config/rollup.config.js
+++ b/config/rollup.config.js
@@ -2,6 +2,10 @@ import nodeResolve from 'rollup-plugin-node-resolve';
import typescriptPlugin from 'rollup-plugin-typescript2';
import typescript from 'typescript';
import path from 'path';
+import fs from 'fs';
+import { transformSync } from '@babel/core';
+import cjsModulesTransform from '@babel/plugin-transform-modules-commonjs';
+import umdModulesTransform from '@babel/plugin-transform-modules-umd';
import invariantPlugin from 'rollup-plugin-invariant';
import { terser as minify } from 'rollup-plugin-terser';
@@ -49,29 +53,14 @@ export function rollup({
return './lib/' + outputPrefix + '.' + format + '.js';
}
- function convert(format) {
+ function fromSource(format) {
return {
- input: outputFile('esm'),
+ input,
external,
output: {
file: outputFile(format),
format,
sourcemap: true,
- name,
- globals,
- },
- onwarn,
- };
- }
-
- return [
- {
- input,
- external,
- output: {
- file: outputFile('esm'),
- format: 'esm',
- sourcemap: true,
},
plugins: [
nodeResolve({
@@ -90,14 +79,61 @@ export function rollup({
}),
],
onwarn,
- },
- convert('umd'),
- convert('cjs'),
+ };
+ }
+
+ function fromESM(toFormat) {
+ return {
+ input: outputFile('esm'),
+ output: {
+ file: outputFile(toFormat),
+ format: 'esm',
+ sourcemap: false,
+ },
+ // The UMD bundle expects `this` to refer to the global object. By default
+ // Rollup replaces `this` with `undefined`, but this default behavior can
+ // be overridden with the `context` option.
+ context: 'this',
+ plugins: [{
+ transform(source, id) {
+ const output = transformSync(source, {
+ inputSourceMap: JSON.parse(fs.readFileSync(id + '.map')),
+ sourceMaps: true,
+ plugins: [
+ [toFormat === 'umd' ? umdModulesTransform : cjsModulesTransform, {
+ loose: true,
+ allowTopLevelThis: true,
+ }],
+ ],
+ });
+
+ // There doesn't seem to be any way to get Rollup to emit a source map
+ // that goes all the way back to the source file (rather than just to
+ // the bundle.esm.js intermediate file), so we pass sourcemap:false in
+ // the output options above, and manually write the CJS and UMD source
+ // maps here.
+ fs.writeFileSync(
+ outputFile(toFormat) + '.map',
+ JSON.stringify(output.map),
+ );
+
+ return {
+ code: output.code,
+ };
+ }
+ }],
+ }
+ }
+
+ return [
+ fromSource('esm'),
+ fromESM('cjs'),
+ fromESM('umd'),
{
input: outputFile('cjs'),
output: {
file: outputFile('cjs.min'),
- format: 'cjs',
+ format: 'esm',
},
plugins: [
minify({
diff --git a/package-lock.json b/package-lock.json
index b7f215776ac..5e8d317ce33 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,17 +13,17 @@
}
},
"@babel/core": {
- "version": "7.4.4",
- "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.4.4.tgz",
- "integrity": "sha512-lQgGX3FPRgbz2SKmhMtYgJvVzGZrmjaF4apZ2bLwofAKiSjxU0drPh4S/VasyYXwaTs+A1gvQ45BN8SQJzHsQQ==",
+ "version": "7.4.5",
+ "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.4.5.tgz",
+ "integrity": "sha512-OvjIh6aqXtlsA8ujtGKfC7LYWksYSX8yQcM8Ay3LuvVeQ63lcOKgoZWVqcpFwkd29aYU9rVx7jxhfhiEDV9MZA==",
"dev": true,
"requires": {
"@babel/code-frame": "^7.0.0",
"@babel/generator": "^7.4.4",
"@babel/helpers": "^7.4.4",
- "@babel/parser": "^7.4.4",
+ "@babel/parser": "^7.4.5",
"@babel/template": "^7.4.4",
- "@babel/traverse": "^7.4.4",
+ "@babel/traverse": "^7.4.5",
"@babel/types": "^7.4.4",
"convert-source-map": "^1.1.0",
"debug": "^4.1.0",
@@ -34,6 +34,29 @@
"source-map": "^0.5.0"
},
"dependencies": {
+ "@babel/parser": {
+ "version": "7.4.5",
+ "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.4.5.tgz",
+ "integrity": "sha512-9mUqkL1FF5T7f0WDFfAoDdiMVPWsdD1gZYzSnaXsxUCUqzuch/8of9G3VUSNiZmMBoRxT3neyVsqeiL/ZPcjew==",
+ "dev": true
+ },
+ "@babel/traverse": {
+ "version": "7.4.5",
+ "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.4.5.tgz",
+ "integrity": "sha512-Vc+qjynwkjRmIFGxy0KYoPj4FdVDxLej89kMHFsWScq999uX+pwcX4v9mWRjW0KcAYTPAuVQl2LKP1wEVLsp+A==",
+ "dev": true,
+ "requires": {
+ "@babel/code-frame": "^7.0.0",
+ "@babel/generator": "^7.4.4",
+ "@babel/helper-function-name": "^7.1.0",
+ "@babel/helper-split-export-declaration": "^7.4.4",
+ "@babel/parser": "^7.4.5",
+ "@babel/types": "^7.4.4",
+ "debug": "^4.1.0",
+ "globals": "^11.1.0",
+ "lodash": "^4.17.11"
+ }
+ },
"debug": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
@@ -42,6 +65,12 @@
"requires": {
"ms": "^2.1.1"
}
+ },
+ "globals": {
+ "version": "11.12.0",
+ "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
+ "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==",
+ "dev": true
}
}
},
@@ -86,12 +115,45 @@
"@babel/types": "^7.0.0"
}
},
+ "@babel/helper-module-imports": {
+ "version": "7.0.0",
+ "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.0.0.tgz",
+ "integrity": "sha512-aP/hlLq01DWNEiDg4Jn23i+CXxW/owM4WpDLFUbpjxe4NS3BhLVZQ5i7E0ZrxuQ/vwekIeciyamgB1UIYxxM6A==",
+ "dev": true,
+ "requires": {
+ "@babel/types": "^7.0.0"
+ }
+ },
+ "@babel/helper-module-transforms": {
+ "version": "7.4.4",
+ "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.4.4.tgz",
+ "integrity": "sha512-3Z1yp8TVQf+B4ynN7WoHPKS8EkdTbgAEy0nU0rs/1Kw4pDgmvYH3rz3aI11KgxKCba2cn7N+tqzV1mY2HMN96w==",
+ "dev": true,
+ "requires": {
+ "@babel/helper-module-imports": "^7.0.0",
+ "@babel/helper-simple-access": "^7.1.0",
+ "@babel/helper-split-export-declaration": "^7.4.4",
+ "@babel/template": "^7.4.4",
+ "@babel/types": "^7.4.4",
+ "lodash": "^4.17.11"
+ }
+ },
"@babel/helper-plugin-utils": {
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.0.0.tgz",
"integrity": "sha512-CYAOUCARwExnEixLdB6sDm2dIJ/YgEAKDM1MOeMeZu9Ld/bDgVo8aiWrXwcY7OBh+1Ea2uUcVRcxKk0GJvW7QA==",
"dev": true
},
+ "@babel/helper-simple-access": {
+ "version": "7.1.0",
+ "resolved": "https://registry.npmjs.org/@babel/helper-simple-access/-/helper-simple-access-7.1.0.tgz",
+ "integrity": "sha512-Vk+78hNjRbsiu49zAPALxTb+JUQCz1aolpd8osOF16BGnLtseD21nbHgLPGUwrXEurZgiCOUmvs3ExTu4F5x6w==",
+ "dev": true,
+ "requires": {
+ "@babel/template": "^7.1.0",
+ "@babel/types": "^7.0.0"
+ }
+ },
"@babel/helper-split-export-declaration": {
"version": "7.4.4",
"resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.4.4.tgz",
@@ -146,6 +208,27 @@
"@babel/helper-plugin-utils": "^7.0.0"
}
},
+ "@babel/plugin-transform-modules-commonjs": {
+ "version": "7.4.4",
+ "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.4.4.tgz",
+ "integrity": "sha512-4sfBOJt58sEo9a2BQXnZq+Q3ZTSAUXyK3E30o36BOGnJ+tvJ6YSxF0PG6kERvbeISgProodWuI9UVG3/FMY6iw==",
+ "dev": true,
+ "requires": {
+ "@babel/helper-module-transforms": "^7.4.4",
+ "@babel/helper-plugin-utils": "^7.0.0",
+ "@babel/helper-simple-access": "^7.1.0"
+ }
+ },
+ "@babel/plugin-transform-modules-umd": {
+ "version": "7.2.0",
+ "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.2.0.tgz",
+ "integrity": "sha512-BV3bw6MyUH1iIsGhXlOK6sXhmSarZjtJ/vMiD9dNmpY8QXFFQTj+6v92pcfy1iqa8DeAfJFwoxcrS/TUZda6sw==",
+ "dev": true,
+ "requires": {
+ "@babel/helper-module-transforms": "^7.1.0",
+ "@babel/helper-plugin-utils": "^7.0.0"
+ }
+ },
"@babel/polyfill": {
"version": "7.4.4",
"resolved": "https://registry.npmjs.org/@babel/polyfill/-/polyfill-7.4.4.tgz",
diff --git a/package.json b/package.json
index 60c711b77eb..ed3accf7086 100644
--- a/package.json
+++ b/package.json
@@ -29,7 +29,7 @@
{
"name": "apollo-cache-inmemory",
"path": "./packages/apollo-cache-inmemory/lib/bundle.cjs.min.js",
- "maxSize": "5 kB"
+ "maxSize": "5.05 kB"
},
{
"name": "apollo-client",
@@ -60,6 +60,9 @@
"graphql-anywhere": "file:packages/graphql-anywhere"
},
"devDependencies": {
+ "@babel/core": "7.4.5",
+ "@babel/plugin-transform-modules-commonjs": "7.4.4",
+ "@babel/plugin-transform-modules-umd": "7.2.0",
"@condenast/bundlesize": "0.18.1",
"@octokit/rest": "16.27.3",
"@types/benchmark": "1.0.31",