babel / babel/babel-loader

envName option doesn't seem to work well when used in multiple webpack configs

Open
#817 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
4.8k
Forks
456
Avg merge
9h 19m
Merged PRs (30d)
2

Description

**I'm submitting a bug report**

**Webpack Version:**
4.41.2

**Babel Core Version**:
7.7.4

**Babel Loader Version**:
8.0.6

**Please tell us about your environment:**
macOS 10.15.1 / Ubuntu 16.04.6 LTS

**Current behavior:**
I have the following `babel.config.js`:

```
module.exports = (api) => {
const envOptions = {
corejs: 3,
useBuiltIns: 'usage',
};

const plugins = [];

const presets = [
['@babel/preset-env', envOptions],
'@babel/preset-flow',
'@babel/preset-react',
];

if (api.env('browser')) {
envOptions.targets = [
'last 2 versions',
'not dead',
];
}

if (api.env('node')) {
envOptions.targets = 'node 10';
}

if (api.env('test')) {
plugins.push('@babel/plugin-transform-modules-commonjs');
}

api.cache(true);

return {
plugins,
presets,
};
};
```

And my `webpack.config.js` looks like this:

```
module.exports = [
{
// ...
module: {
rules: [
// ...
{
loader: 'babel-loader',
options: {
cacheDirectory: true,
envName: 'browser',
rootMode: 'upward',
},
test: /\.jsx?$/,
type: 'javascript/auto',
}
// ...
]
}
// ...
},
{
// ...
module: {
rules: [
// ...
{
loader: 'babel-loader',
options: {
cacheDirectory: true,
envName: 'node',
rootMode: 'upward',
},
test: /\.jsx?$/,
type: 'javascript/auto',
}
// ...
]
}
// ...
},
];
```

So basically I have 2 webpack configs one to generate the browser bundles and another one to generate the SSR bundles. I use the `envName` option of `babel-loader` to determine the transpilation targets. Somehow this doesn't seem to work. It seems that the `node` config is always being picked up. Or that the last one to be set is the one used for both configs.

**Expected/desired behavior:**

I would expect one config to be transpiled against the targets set for the `browser` environment and the other one for the `node` environment.

* **If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem along with a gist/jsbin of your webpack configuration.**

I can't figure out how would I reproduce this via jsbin...

* **What is the expected behavior?**

I would expect one config to be transpiled against the targets set for the `browser` environment and the other one for the `node` environment.

* **What is the motivation / use case for changing the behavior?**

Support for webpack configurations with multiple configs?

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.