0

We have a node.js app bundled for production using Webpack.

Our problem is how to add dynamic configuration after you already have a bundle, without the need to re-bundle?

On the server-side, we can just use node env variables, but how can this be done for the client bundle? Specifically, we need to tell a browser module to which api server address to connect.

Having a js/json file with the configurations causes the configuration values to be injected into the bundle, and therefore can't be changed afterwards (in a comfortable manner, without open the bundle file and manually finding and replacing).

Using something like express-expose, isn't something we want, since it causes another network request to get the data, and our server address is dynamic.

node-config etc., don't work on client side

omerts
  • 8,485
  • 2
  • 32
  • 39
  • Check if this point you a solution: http://stackoverflow.com/questions/35408898/why-is-my-webpack-bundle-js-and-vendor-bundle-js-so-incredibly-big/35413001#35413001 – Vinicius Vieira Aug 02 '16 at 13:23
  • @ViniciusVieira it looks like it shows how to use environmental variables, which are unavailable at the browser – omerts Aug 02 '16 at 15:00
  • Can't you use different scripts to create different bundles, for the states you need to? – Vinicius Vieira Aug 02 '16 at 15:26
  • The thing is we don't want it to be bundled, cause than it is not dynamic, and can't easily let a client change it after it is bundled – omerts Aug 02 '16 at 15:56

1 Answers1

1

You can make creative use of the externals option:

externals: [
    { appConfig: 'var appConfig' },
],

If you add that to your configuration you can just let your web server add a script tag with var appConfig = {"config":"value"}; somewhere before the loading of your webpack bundle, and a simple require('appConfig') will pick it up.

Ambroos
  • 3,456
  • 20
  • 27
  • 1
    Thanks for the answer. We actually ended up having the server add a script before the bundle with global config vars, but with your method we can control the behavior through webpack. – omerts Aug 04 '16 at 17:22