-
-
Notifications
You must be signed in to change notification settings - Fork 26.9k
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
Turn on Babel helpers
#5093
Turn on Babel helpers
#5093
Conversation
x-ref: babel/babel#5442 |
@@ -27,6 +17,7 @@ module.exports = function(api, opts, env) { | |||
var isEnvProduction = env === 'production'; | |||
var isEnvTest = env === 'test'; | |||
var isFlowEnabled = validateBoolOption('flow', opts.flow, true); | |||
var areHelpersEnabled = validateBoolOption('helpers', opts.helpers, true); |
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.
Wait, shouldn't default be false?
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.
This is the non-dependency version.
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.
Ah it's for app code. Hmm.
Would it break these instructions?
https://reactjs.org/docs/add-react-to-a-website.html#run-jsx-preprocessor
If so I think it should still be off by default.
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.
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.
Right but I don't want this to break non-commonjs usage.
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.
Or maybe we should have a separate entry point for "standalone" usage.
*/ | ||
'use strict'; | ||
|
||
const validateBoolOption = (name, value, defaultValue) => { |
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.
Copy paste is your friend! Although I don't care
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.
As in you'd rather it be copypasta instead of a util file? 😄
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.
If it's something trivial like this, yeah I don't mind copy pasta.
@@ -10,6 +10,6 @@ | |||
const babelJest = require('babel-jest'); | |||
|
|||
module.exports = babelJest.createTransformer({ | |||
presets: [require.resolve('babel-preset-react-app')], | |||
presets: [[require.resolve('babel-preset-react-app'), { helpers: true }]], |
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.
Doesn't matter for Jest though?
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.
Probably not, how about eject? This is why I'd rather it by on by default, see eject.js
.
@@ -234,7 +234,12 @@ module.exports = { | |||
options: { | |||
// @remove-on-eject-begin |
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.
This is removed on eject. Where do we decide what to write on eject? Seems like we'd lose this. Maybe it means I wasn't right about the app default.
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.
If we go ahead we'll need to figure out what to change our standalone JSX instructions to before this hits stable. Actually it might be sufficient to just disable helpers in |
Hmm, OK. We'll make helpers on by default for apps, helpers off by default for dependencies, and helpers off by default for What about |
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.
Let's make it on by default for app (any env), off by default for node_modules (any env).
But also let's make it off for /dev
, /prod
, /test
entry points which are probably mostly used by people without config (and possibly without commonjs). /test
is a funny one but let's treat it like other standalones.
Ready for review, I dropped the e2e changes for tersity and will have a follow up PR. |
@@ -9,5 +9,5 @@ | |||
const create = require('./create'); | |||
|
|||
module.exports = function(api, opts) { | |||
return create(api, opts, 'development'); | |||
return create(api, { helpers: false, ...(opts || {}) }, 'development'); |
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's fine to spread undefined. I don't think you need || {}
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.
This is object spread though. Is it supported in all envs we target?
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.
look at that. they thought of everything.
tasks/e2e-kitchensink.sh
Outdated
@@ -146,10 +146,6 @@ PORT=3001 \ | |||
nohup yarn start &>$tmp_server_log & | |||
grep -q 'You can now view' <(tail -f $tmp_server_log) | |||
|
|||
# Before running Mocha, specify that it should use our preset | |||
# TODO: this is very hacky and we should find some other solution | |||
echo '{"presets":["react-app"]}' > .babelrc |
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.
Nice find
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.
Bad find, this broke the tests.
@@ -146,6 +146,10 @@ PORT=3001 \ | |||
nohup yarn start &>$tmp_server_log & | |||
grep -q 'You can now view' <(tail -f $tmp_server_log) | |||
|
|||
# We haven't ejected yet which means there's no `babel` key | |||
# in package.json yet | |||
echo '{"presets":["react-app"]}' > .babelrc |
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.
Can we just put it in our jest integration config or something? Why does it have to be at the root?
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.
I dunno what's best, but during eject we add it to package.json
. Will file follow up issue.
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.
I just mean that in this case we only need it for integration test itself. So it's unrelated to our app and I'd like it to stay unrelated (if that makes sense)
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.
That makes sense. We'll figure something out.
* Turn on helpers and test importing something with async/await works * Compiling babel runtime breaks itself * Add helpers option to babel plugin with defaults * Make helpers off by default and on in our configuration * Hit eject and e2e * meh * copy'n'paste * change again * Turn off helpers by default in /prod, /dev, /test * oops * Spread undefined * Use object assign not object spread * Put preset in template since it's needed * Fix e2e tests
This turns on Babel
helpers
to reduce bundle size.Resolves long standing #238 and recently opened #5092.
closes #5092