I'm using webpack.DefinePlugin with a really simple config to set a client vs server var:
new webpack.DefinePlugin({
__CLIENT__: JSON.stringify(false),
})
When I run this over the following file, it only replaces one of the two uses of __CLIENT__:
export const CLIENT = __CLIENT__;
export const processEnv = __CLIENT__ ? null : process.env;
// === compiles to the following: ===>
export const CLIENT = false;
export const processEnv = __CLIENT__ ? null : process.env; // __CLIENT__ doesn't get replaced.
When I change the second line to have anything other than process.env, it works fine.
export const CLIENT = __CLIENT__;
export const processEnv = __CLIENT__ ? null : 'works!';
// === compiles to the following: ===>
export const CLIENT = false;
export const processEnv = false ? null : 'works!'; // __CLIENT__ gets replaced.
I can work around this problem pretty trivially by first saving __CLIENT__ to some other variable like the following, but it makes me completely distrust webpack.DefinePlugin for future uses.
export const CLIENT = __CLIENT__;
export const processEnv = CLIENT ? null : process.env;
// === compiles to the following: ===>
export const CLIENT = false;
export const processEnv = false ? null : process.env; // Works, compiles fine.
Perhaps even stranger, it seems like webpack.DefinePlugin cares about the value I'm setting. This compile properly:
new webpack.DefinePlugin({
__CLIENT__: JSON.stringify(true), // Instead of false
})
...
// Same code as initial example:
export const CLIENT = __CLIENT__;
export const processEnv = __CLIENT__ ? null : process.env;
// === compiles to the following: ===>
export const CLIENT = true;
export const processEnv = true ? null : 0; // Works, compiles fine.
Why does webpack.DefinePlugin care what my replacement value is? Am I doing something wrong? Is there some other configuration I should change?