WIP: Bundle @babel/standalone with rollup #7581
Conversation
Gulpfile.js
Outdated
| } | ||
| }, | ||
| resolveId(importee) { | ||
| const matches = importee.match(/^@babel\/([^/]+)$/); |
There was a problem hiding this comment.
I've created https://github.com/Andarist/lerna-alias pretty much for this exact thing - aliasing to respective src.
There was a problem hiding this comment.
But it does not replace lib with src in the main entry?
There was a problem hiding this comment.
It does exactly this (or I've misunderstood your question) - it searches for packages managed by lerna (using lerna's algo - although it's copied) and creates an alias map from PKG_NAME to PKG_PATH/src
Gulpfile.js
Outdated
| "package.json" | ||
| )); | ||
|
|
||
| const filename = |
There was a problem hiding this comment.
does any of our packages use browser field that should be resolved here? rollup-plugin-node-resolve handles browser field if u pass browser: true as an option to it - which I see that you have used
There was a problem hiding this comment.
The problem is that the browser field is using /lib/ and not /src/ so the node plugin won't pick it up.
There was a problem hiding this comment.
Oh, ok - I've searched for a simple "browser" fields with string value, I see we have some object maps there in i.e. @babel/core.
I think it might be possible to workaround this easier - rename our browser files to have .browser.js extension and make rollup-plugin-node-resolve to pick it up instead of the original one by passing extensions: ['.browser.js', '.js'] option
There was a problem hiding this comment.
I'd assume it is fine for the browser field map both src and lib for Babel at least. Would that work? e.g.
"browser": {
"./lib/config/files/index.js": "./lib/config/files/index-browser.js",
"./lib/transform-file.js": "./lib/transform-file-browser.js",
"./lib/transform-file-sync.js": "./lib/transform-file-sync-browser.js"
"./src/config/files/index.js": "./src/config/files/index-browser.js",
"./src/transform-file.js": "./src/transform-file-browser.js",
"./src/transform-file-sync.js": "./src/transform-file-sync-browser.js"
},
There was a problem hiding this comment.
yeah, this definitely should work too 👍
|
Build successful! You can test your changes in the REPL here: https://babeljs.io/repl/build/9393/ |
|
What's the status of this PR? Is this still something we'd like to pursue? I could work on rebasing this and taking this through the finish line. |
|
It is finally working. I wonder why babel-standalone is 50% smaller. In the repl everything works correctly, besides typescript (but typescript is also not working without this PR for me.). I will now cleanup the PR and do some more stats. |
|
Do we intend to support IE11 in the repl? If yes then would be great to check if its working there.
It depends on the previous setup, I've seen such reductions before when migrating from webpack to rollup (well, maybe not that big ones, but I've seen 30-40% reductions). If you are curious about it then the easiest way to find out would be to compare what was in the final bundle before and what is now - source map explorer could come in handy for that. |
github-actions
bot
added
the
outdated
This is still very early and super messy right now. Also it does not yet work completely as long as rollup/rollup#2059 isn't released. Locally I got the tests already passing.
So far it looks like the bundle size will decrease (I might have some more ideas for example excluding
debugin the bundle):babel.js
2.7MB->1.5MBbabel.min.js
1.4MB->0.8MBDepends on :
Fix Class and FunctionExpressions in default exports rollup/rollup#2059