Provide esm output #2
Conversation
|
/cc @jxnblk |
In this diff I added esm support via dual mode. The idea is keeping cjs/esm pair with the same file name and with js and mjs extensions. Bundler may choose which format to use. main (dist/index) bundler will choose on of these - dist/index.js - dist/index.mjs /emotion reexports from dist/emotion - dist/emotion/index.js - dist/emotion/index.mjs Ref https://medium.com/@giltayar/native-es-modules-in-nodejs-status-and-future-directions-part-i-ee5ea3001f71 Upgraded babel to be able to use js config.
|
Friendly ping @jxnblk I could help with other packages if you are okay with this PR. |
|
@jxnblk Without this I am not able to bundle |
.babelrc.js
Outdated
| plugins: [] | ||
| } | ||
|
|
||
| if (process.env.NODE_ENV.includes('emotion')) { |
There was a problem hiding this comment.
This could still be handled with the env field right? Sorry haven't had time to dig into some of the Babel 7 changes yet
There was a problem hiding this comment.
env field works only with json config. I use js here to achieve some logic.
There was a problem hiding this comment.
Thanks, I haven't seen anything about the env field being deprecated in Babel 7 – if you happen to have a link to the docs that'd be helpful
There was a problem hiding this comment.
It's not deprecated (well, it was for a while).
env field just not used by js config. Consider json version with env field is a wrapper around it. Don't know where this mentioned in docs to be honest.
package.json
Outdated
| "@babel/core": "^7.0.0", | ||
| "@babel/preset-env": "^7.0.0", | ||
| "@babel/preset-react": "^7.0.0", | ||
| "babel-core": "^7.0.0-bridge.0", |
There was a problem hiding this comment.
Bridge is just for jest since it doesn't fully support Babel 7 yet, right?
package.json
Outdated
| "styled:esm": "NODE_ENV=styled:esm babel src/index.js -o dist/index.mjs", | ||
| "emotion:cjs": "NODE_ENV=emotion:cjs babel src/index.js -o dist/emotion/index.js", | ||
| "emotion:esm": "NODE_ENV=emotion:esm babel src/index.js -o dist/emotion/index.mjs", | ||
| "prepare": "rm -rf dist && mkdir dist && mkdir dist/emotion && npm run styled:cjs && npm run styled:esm && npm run emotion:cjs && npm run emotion:esm", |
There was a problem hiding this comment.
You didn't used to need to mkdir for babel-cli, is this because they're subdirectories? If so, why not keep it flat?
There was a problem hiding this comment.
Yes, seems like a regression in v7. Opened PR babel/babel#8622
Do you want (index.js,emotion.js)?
There was a problem hiding this comment.
Yeah, I mean if you're switching from compiling directories to compiling files, I don't see the need for additional subdirectories
|
Thanks for this! I like using babel for small packages like this a lot more than having to include rollup as an additional dependency/config. I'm planning on working on Rebass some over the weekend so will probably push a release then |
|
Made this structure |
|
I'm not gonna contribute to this project anymore. |
In this diff I added esm support via dual mode. The idea is keeping
cjs/esm pair with the same file name and with js and mjs extensions.
Bundler may choose which format to use.
main (dist/index) bundler will choose on of these
/emotion reexports from dist/emotion
Ref https://medium.com/@giltayar/native-es-modules-in-nodejs-status-and-future-directions-part-i-ee5ea3001f71
Upgraded babel to be able to use js config.