Webpack conditionally require file base on environment mode

Question

I have 3 config JavaScript files like config.local.js, config.dev.js, config.prod.js. An example of one of these files.

// config.dev.js

function Config(){
    return{
        apiUrl: "https://myapi.dev.com/"
    }
}

module.exports = Config;

Now I have an entry file that requires this config file. For instance:

// register.js

function Register(){
    const config = require("../config");

    // rest of the code to use that config
}

My web pack config looks like this.

module.exports = {
    entry: {
        register: "./app/src/register.js",
    },
    output: {
        filename: "[name].js",
        path: __dirname + "/app/dist",
    },
};

I would like that when I run web pack for production (web pack --mode=production), it would bundle the config.prod.js file.

Is this possible?

check this answers https://stackoverflow.com/questions/30030031/passing-environment-dependent-variables-in-webpack — Ahmed ElMetwally, Jul 14 '20 at 02:05

score 0 · Accepted Answer · answered Jul 14 '20 at 01:41

0

See this page: https://webpack.js.org/guides/dependency-management/

require('../config.' + process.env.NODE_ENV)

answered Jul 14 '20 at 01:41

Lucas D

460
1
4
15

Webpack conditionally require file base on environment mode

1 Answers1