This repository has been archived by the owner on Apr 13, 2023. It is now read-only.
Make sure npm run watch builds ESM/UMD bundles
#2765
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
When testing new `react-apollo` changes out (during core development), it can be useful to `npm link` `react-apollo` into a test app. After the link is in place, the `npm run watch` script can be used to compile typescript file changes, in watch mode. So while working on the `react-apollo` codebase, .ts file changes will be picked up automatically, compiled, and because of the `npm link`, the test app will recognize that there have been changes made to `react-apollo` and re-run with the updated version. Unfortunately, `npm run watch` doesn’t currently work as it’s missing the additional post compilation steps that `npm run compile` leverages via `postcompile`. This mean that `npm run watch` isn’t calling `rollup` and generating the associated ESM/UMD bundles. So when typescript changes are picked up and compiled, the application at the other end of the link doesn’t always recognize that `react-apollo` has been updated, since it doesn’t see changes in the ESM/UMD bundles (if it’s using them - e.g. `create-react-app` is). This commit first introduces the `tsc-watch` helper utility to make it easier to run scripts after watched typescript files are compiled. It then wires in changes to call `npm run postcompile` after watched typescript compilation has completed. This helps ensure that apps at the other end of the link see changes, since the ESM/UMD bundles are regenerated. One thing to note is that running rollup with the current config takes about 3 seconds. This adds a delay between making changes in `react-apollo` and seeing them show up in the linked application. We can reduce this time by adjusting the rollup config to accommodate watching and only generate the bundles we need, but given that this functionality is currently broken as is, this commit will at least get things back to a working state.
npm run watch builds ESM/UMB bundlesnpm run watch builds ESM/UMD bundles
hwillson
added a commit
to apollographql/apollo-client
that referenced
this pull request
Feb 22, 2019
Changes to make sure calling `npm run watch` in any of this repo's child packages ensures the final bundles are built after compilation has completed. For the full details on why this is needed, see: apollographql/react-apollo#2765
hwillson
added a commit
to apollographql/apollo-client
that referenced
this pull request
Feb 25, 2019
Changes to make sure calling `npm run watch` in any of this repo's child packages ensures the final bundles are built after compilation has completed. For the full details on why this is needed, see: apollographql/react-apollo#2765
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
When testing new
react-apollochanges out (during core development), it can be useful tonpm linkreact-apollointo a test app. After the link is in place, thenpm run watchscript can be used to compile typescript file changes, in watch mode. So while working on thereact-apollocodebase, .ts file changes will be picked up automatically, compiled, and because of thenpm link, the test app will recognize that there have been changes made toreact-apolloand re-run with the updated version.Unfortunately,
npm run watchdoesn’t currently work as it’s missing the additional post compilation steps thatnpm run compileleverages viapostcompile. This mean thatnpm run watchisn’t callingrollupand generating the associated ESM/UMD bundles. So when typescript changes are picked up and compiled, the application at the other end of the link doesn’t always recognize thatreact-apollohas been updated, since it doesn’t see changes in the ESM/UMD bundles (if it’s using them - e.g.create-react-app).This commit first introduces the
tsc-watchhelper utility to make it easier to run scripts after watched typescript files are compiled. It then wires in changes to callnpm run postcompileafter watched typescript compilation has completed. This helps ensure that apps at the other end of the link see changes, since the ESM/UMD bundles are regenerated.One thing to note is that running rollup with the current config takes about 3 seconds. This adds a delay between making changes in
react-apolloand seeing them show up in the linked application.We can reduce this time by adjusting the rollup config to accommodate watching and only generate the bundles we need, but given that this functionality is currently broken as is, this commit will at least get things back to a working state.