Babel-loader: Babel-loader can't find production section in .babelrc

Created on 12 May 2017  路  7Comments  路  Source: babel/babel-loader

Webpack Version:
2.5

Babel Core Version:
6.24

Babel Loader Version:
6.2.0

Please tell us about your environment:
Windows 10

Behavior:
I am using babel-loader with .babelrc file. When i build for production i want to add some additional options, thats why i have separate section for production. In webpack config i set BABEL_ENV = "production". The issue is that babel-loader doesn't actually use the "production" case in .babelrc. To test it, i commented the development section and bundle doen't build with error on transpiling jsx. Thought for some reason babel-loader uses the default development section of .babelrc. Setting the NODE_ENV = "production" doesn't helped, which should be the expected behavior.

{
    "env": {
        // "development": {            
        //     "presets": ["es2015", "react", "stage-2"]
        // },
        "production": {
            "presets": [["es2015", { "modules": false }], "react", "stage-2"]
        }
    }
}

webpack.config.js

rules: [
            {
                test: /\.jsx?$/,
                exclude: [/node_modules/],
                loader: "babel-loader"
            }
   //....
],
plugins: [
            new DefinePlugin({
                "process.env": {
                    "NODE_ENV": production,
                    "BABEL_ENV": production
                }
            }),
 // ...
]
question

Most helpful comment

@Ky6uk The mode flag is an argument for Webpack itself and what plugins and behaviors it enables. I don't think having it influence Babel's configuration as the default would be reasonable. You can always do that yourself, e.g.

 module.exports = function(env) {
   // ...
   {
     loader: "babel-loader",
     options: {
       forceEnv: env.production ? "production" : "development"
     }
   }
 };

in your Webpack config if you'd like.

All 7 comments

DefinePlugin sets the environments statically in output files, it doesn't affect loaders. You have to set the runtime environment for the webpack process to change Babel's env.

@loganfsmyth if you mean to run with -p flag, this doesn't help

You should run BABEL_ENV=production webpack or similar.

It's strange behaviour when webpack's loader babel-loader ignores --mode production flag. Isn't?

@Ky6uk The mode flag is an argument for Webpack itself and what plugins and behaviors it enables. I don't think having it influence Babel's configuration as the default would be reasonable. You can always do that yourself, e.g.

 module.exports = function(env) {
   // ...
   {
     loader: "babel-loader",
     options: {
       forceEnv: env.production ? "production" : "development"
     }
   }
 };

in your Webpack config if you'd like.

I'm not sure if this issue was fixed: babel/babel#4539

@Ky6uk The mode flag is an argument for Webpack itself and what plugins and behaviors it enables. I don't think having it influence Babel's configuration as the default would be reasonable. You can always do that yourself, e.g.

 module.exports = function(env) {
   // ...
   {
     loader: "babel-loader",
     options: {
       forceEnv: env.production ? "production" : "development"
     }
   }
 };

in your Webpack config if you'd like.

Above works as charm. however in Babel 7 the changed to envName:

The option forceEnv has been removed in favor of envName in Babel 7.

Was this page helpful?
0 / 5 - 0 ratings