-
Notifications
You must be signed in to change notification settings - Fork 811
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: add ESM builds for packages used in browser #2112
Conversation
Codecov Report
@@ Coverage Diff @@
## main #2112 +/- ##
=======================================
Coverage 92.76% 92.76%
=======================================
Files 140 140
Lines 4987 4987
Branches 1029 1029
=======================================
Hits 4626 4626
Misses 361 361
|
@@ -0,0 +1,54 @@ | |||
{ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It would be nice to be able to automate the generation of this file so that the new entry will be added or removed automatically. I'm fine with doing this either in this PR or as a separate PR. Some js script that will find all tsconfig.esm.json
files in packages folder then will update references
and create a new file.
WDYT ?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Shouldn't the references
be in the base tsconfig being extended?
Co-authored-by: Bartlomiej Obecny <bobecny@gmail.com>
@@ -0,0 +1,11 @@ | |||
{ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
no references
?
edit: thinking more it might not be needed for individual package esm builds to have the references
since it's only used in local dev.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
lgtm
Which problem is this PR solving?
Continuation of open-telemetry/opentelemetry-js-api#25:
Fixes #1378
Fixes #1253
Short description of the changes
Added config files for tsc to build esm versions into
build/esm
of each package that is used in browser (as determined by existence oftest:browser
script in it's package.json, plus@opentelemetry/context-zone
,@opentelemetry/propagator-b3
and@opentelemetry/resources
) and referenced it in theirpackage.json
asmodule
entrypoint. There was also a few errors that esm builds added that were fixed (using array spread syntax with a generator and importing lodash.merge)Effect on bundle size
Test was done by doing
npm pack
on each package (+ current head version of@opentelemetry/api
) and then placed in the right folder insideexamples/tracer-web/node_modules/@opentelemetry
. (I did try using npm links but that attempt didn't end well)Devtool commented out in
examples/tracer-web/webpack.config.js
and built usingnpx webpack --mode production --profile --json > stats.json
to generate stats file for better analysis."module"
removed frompackage.json
(forcing cjs usage)
"module"
inpackage.json
fetch.js
metrics.js
xml-http-request.js
zipkin.js
Comparison using webpack visualizer. Left - cjs, Right - ESM (note how individual files aren't shown)
Potential improvements
lodash.merge
can't be normally imported as it doesmodule.exports = func
so it uses cjsrequire()
. lodash merge #1928 already highlighted it's size being an issue so this is another reason to replace it/tsconfig.esm.json
needs to be manually updated.