Skip to content

Commit

Permalink
Replace requireReactLazily with CJS bundle manipulation
Browse files Browse the repository at this point in the history
to help prevent modern bundlers from requiring React when used
with `@apollo/client/core` (in other words, without any of
Apollo Client's React components). While this approach works
well for applications that aren't using React, it introduces
problems for bundlers and applications that are using React
(as outlined in #6035 and #6352). There are several different ways
we can address this, and we might do something more substantial
in the future, but for now this commit manipulates Apollo Client's
core CJS bundle at build time, to make the React require optional.

Fixes #6035.
Fixes #6352.
  • Loading branch information
hwillson committed May 29, 2020
1 parent 4b1fe83 commit ad74c84
Show file tree
Hide file tree
Showing 22 changed files with 166 additions and 133 deletions.
31 changes: 31 additions & 0 deletions config/rollup.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,37 @@ function prepareCJS(input, output) {
},
plugins: [
nodeResolve(),
// When generating the `dist/core/core.cjs.js` entry point (in
// `config/prepareDist.js`), we filter and re-export the exports we
// need from the main Apollo Client CJS bundle (to exclude React related
// code). This means that consumers of `core.cjs.js` attempt to load the
// full AC CJS bundle first (before filtering exports), which then means
// the React require in the AC CJS bundle is attempted and not found
// (since people using `core.cjs.js` want to use Apollo Client without
// React). To address this, we make React an optional require in the CJS
// bundle.
(() => {
const cjsBundle = output.replace(`${distDir}/`, '');
return {
generateBundle(_option, bundle) {
const { code } = bundle[cjsBundle];
const regex = /var React = require\('react'\);/;
const matches = code.match(regex);
if (matches && matches.length === 1) {
bundle[cjsBundle].code =
code.replace(
regex,
"try { var React = require('react'); } catch (error) {}"
);
} else {
throw new Error(
'The CJS bundle could not prepared as a single React ' +
'require could not be found.'
);
}
}
}
})()
],
};
}
Expand Down

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

16 changes: 8 additions & 8 deletions examples/bundling/no-tree-shaking/rollup-ac3/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

147 changes: 94 additions & 53 deletions examples/bundling/tree-shaking/rollup-ac3/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions examples/bundling/tree-shaking/rollup-ac3/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -30,8 +30,8 @@
"dependencies": {
"@apollo/client": "file:../../../../dist",
"graphql": "^14.5.8",
"react": "^16.13.0",
"react-dom": "^16.13.0"
"react": "file:../../../../node_modules/react",
"react-dom": "file:../../../../node_modules/react-dom"
},
"devDependencies": {
"@babel/preset-react": "^7.0.0",
Expand Down
Loading

0 comments on commit ad74c84

Please sign in to comment.