如何使用webpack.config.js自定义配置？

Question

I have a react project with webpack with a webpack.config.js file like this

const webpack = require('webpack');

const config = {
  serverBaseUrl: 'http://localhost:3000',
  devtool: "inline-source-map",
  entry:  __dirname + "/app/App.js",
  output: {
    path: "./public/js/",
    publicPath: "/js/",
    filename: "bundle.js"
  },
  module: {
    loaders: [{
      test: /.jsx?$/,
      exclude: /node_modules/,
      loader: "babel",
      query: {
        presets: ["es2015","react","stage-0"]
      }
    }]
  },
  devServer: {
    port: 8008,
    contentBase: "./public",
    colors: true,
    historyApiFallback: true,
    inline: true
  },
}

if (process.env.NODE_ENV === 'production') {
  config.serverBaseUrl = 'http://api.domain.com';
  config.devtool = false;
  config.plugins = [
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.optimize.UglifyJsPlugin({comments: false}),
    new webpack.DefinePlugin({
      'process.env': {NODE_ENV: JSON.stringify('production')}
    })
  ];
};

module.exports = config;

I would like to use config.serverBaseUrl in another js file? What should I do?

Can I do

const config = require('./webpack.config.js')

and use the config like this

config.serverBaseUrl

UPDATE :

if I use const= require('config') in another file I got this error

ERROR in ./app/components/ComponentBase.js
Module not found: Error: Cannot resolve module 'config' in /Users/username/data/projects/bwe_web/app/components
 @ ./app/components/ComponentBase.js 33:13-30

Answer 1

ICN, To go along with J. Titus statement, you probably should just create another JavaScript class called say Environment.js and export it and use the settings from there. At the top of your JS class you can require Environment.js and then just pull in the values. Keep your webpack config your web.pack config.

'use strict'
var EnvironmentSettings = function(){
   var serverBaseUrl = 'http://api.domain.com';
};

module.exports.EnvironmentSettings = EnvironmentSettings;

Then for any implementation that you need or say want to implement/initialize, you'd just require it at the top of the JavaScript Class.

const envSettings = require('EnvironmentSettings');
var api = envSettings.serverBaseUrl

You should familiarize yourself with some kind of JS Patterns as well. Prototype Pattern, Revealing Prototype Pattern and this will help with your education of including external classes.