Как настроить Webpack для изменения конкретного конфигурационного файла для разработки или производства?

У меня есть 2 файла, config_local.js и config_prod.js .

Как бы вы передали переменную в webpack, чтобы в основном генерировать новый файл с именем config_api.js либо из локального, либо из производственного.

Config_local.js 

"api": {
  "login": "http://localhost/app/api/login/",
  "users": "http://localhost/app/api/users/"
}

Config_prod.js 

"api": {
  "login": "/app/api/login/",
  "users": "/app/api/users/"
}

Затем внутри моих сервисов / api.JS файл 

import axios from 'axios'

export const userLogin = (username, password) => {
    const post_data = { username, password };
    return axios.post('http://localhost/app/api/login', post_data)
        .then(res => res);
};

Я мог бы сделать что-то вроде этого: 

import axios from 'axios'
import api from 'config_api' 

export const userLogin = (username, password) => {
    const post_data = { username, password };
    return axios.post(api.login, post_data)  // <--
        .then(res => res);
};
1 2
webpack webpack-2

1 ответ:

В упаковке.json вы можете использовать скрипты или даже в командной строке вы можете использовать переменную окружения.s

 "scripts": {
    "dev": "NODE_ENV=development webpack",
    "production": "NODE_ENV=production webpack",
    "watch": "npm run dev -- --watch"
  },

В webpack.конфиг.js вы можете использовать 

const inProduction = process.env.NODE_ENV === 'production';
const inDevelopment = process.env.NODE_ENV === "development";


if(inProduction) 
//do this
if(inDevelopment)
//do that

Webpack по умолчанию ищет weback.конфиг.js однако для пользовательского конфигурирования вы можете использовать webpack --config config_local.js

1