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
Add explicit note in README that .babelrc
and babel.configs.js
are consumed automatically
#823
Comments
What is more confusing to me is that when you have both Perhaps @loganfsmyth can give some enlightenments on this? |
Please ignore my remark. After digging down a bit deeper, |
On that note, documenting that options passed to |
Maybe we should link https://babeljs.io/docs/en/options#merging in the readme, and improve that section of the docs on the website? |
Even that documentation isn't very explicit by itself, IMO. This helps explain how multiple configs resolve against each other, but maybe a small sentence on the fact that root-level Babel config files are picked up implicitly when you have root-level webpack config using babel-loader (and that there are other situations where configs are picked up automatically). |
Just stumbled on this issue. Would be great to get this added to the documentation. |
Something that isn't quite clear to me: how does Edit: adding module.exports = {
entry: { main: ["./index.tsx?transpiled"] },
module: {
rules: [
{
test: /\.tsx?$/,
resourceQuery: /\?transpiled$/,
use: [
{ loader: require.resolve(`raw-loader`) },
{
loader: require.resolve(`babel-loader`),
options: {
babelrc: false,
presets: [require.resolve(`@babel/preset-typescript`)],
},
},
],
},
],
},
}; |
@nicolo-ribaudo no other maintainer has commented, so I apologize for @ing you ❤️. I'll contribute a PR to resolve this, but I need feedback first on ^ |
I am also utterly confused by this, as there is no documentation describing this and spending trial & error time is not ideal.
@dwiyatci what happens in this instance? babel.config.js module.exports = {
// Plugins run before presets
plugins: [
['./someproj/node_modules/@babel/plugin-transform-spread'],
['./someproj/node_modules/@babel/plugin-proposal-object-rest-spread'],
[
'./someproj/node_modules/@babel/plugin-proposal-decorators',
{ legacy: true },
],
['./someproj/node_modules/@babel/plugin-proposal-class-properties'],
],
presets: [
[
'@babel/preset-env',
{
targets: {
node: 'current',
},
},
],
],
}; webpack.config.js {
test: /\.js$/,
loader: 'babel-loader',
options: {
plugins: [
['@babel/plugin-proposal-decorators', { legacy: true }],
['@babel/plugin-proposal-class-properties'],
['@babel/plugin-proposal-object-rest-spread'],
['@babel/plugin-transform-spread'],
],
},
}, |
@thernstig Well, based on my comment above, nothing will be overridden because the plugin options you specified for each plugin in {
test: /\.js$/,
loader: 'babel-loader',
} To make sure, you can debug it yourself: in your const config = yield loadPartialConfigAsync(injectCaller(programmaticOptions, this.target)); ...or if you don't fancy breakpoint, simply console.log({ plugins: JSON.stringify(config.options.plugins) }); UPDATE: if you use webpack 5 with persistent caching (to filesystem), you probably need to comment out that webpack's |
@dwiyatci If you look again, you notice I also have a edit: I suppose my question is both rhetorical and actually asking, since I both wanted to also highlight these things are not described in the docs and that I was hoping you already knew the answer 😄 |
@thernstig Whoops. Sorry, I missed that. 😅 Yeah, pretty much for |
@dwiyatci I dug some more in my case, and this is what I found out. I have these files: The config for Thus, this is a mess to know what to expect unless printing. |
You can try running |
@thernstig Feels like I just want to forget all of these... Hahahah |
This was causing an issue for me too, I set the babel loader in my webpack config to use some config for treeshaking, but I had a babel.config.js that was not setup for treeshaking and that config overrode the treeshaking config I set in babel-loader! Took me a while to realize the babel-loader options get overridden by babel.config.js |
A closely related documentation issue would be the description of the
It makes it sound like using |
I'm submitting a feature request
I was fairly certain this was a thing, but it took me a long time to confirm to coworkers (and discover the nuances of using
.babelrc
vs.babel.config.js
in the contextbabel-loader
).I think it's a good idea to document the fact that the config file is read automatically.
The text was updated successfully, but these errors were encountered: