What's the use of JSON.parse/stringify when reading an environment variable?

Question

In Pete Hunt's Webpack How To this code is used:

// definePlugin takes raw strings and inserts them, so you can put strings of JS if you want.
var definePlugin = new webpack.DefinePlugin({
 __DEV__: JSON.stringify(JSON.parse(process.env.BUILD_DEV || 'true')),
 __PRERELEASE__: JSON.stringify(JSON.parse(process.env.BUILD_PRERELEASE || 'false'))
});

What is JSON.stringify(JSON.parse(..)) needed here? JSON stringifying/parsing is useful to clone an object to avoid mutations, but process.env.BUILD_DEV is (and can only be?) a string. So, why use it?

• mplungjan: TheTo clone an object one could use var newObj = JSON.parse(JSON.stringify(object)) but not the other way around - perhaps it is a hack to make sure the string is valid even when it contains newlines or quotes
• Carlos Campderrós: This would fail if the environment variables contains something different than a number, null, true or false (or a properly escaped escaped string or json object). May be to avoid people setting BUILD_DEV to "yes", maybe? Although I would remove the outher JSON.stringify()

Answer 1

This is weird code. First off, the cloning mechanism is:

JSON.parse(JSON.stringify(obj))

But, your code is this:

JSON.stringify(JSON.parse(str))

So, it appears to be attempting to clone a JSON string the hard way. That's bizarre because strings are immutable in Javascript so there's no danger in having multiple references to the same string. The underlying string cannot be changed.

I'd say that this extra code seems redundant and unnecessary unless it's somehow just forcing the value of process.env.BUILD_DEV to be something that JSON.parse() will accept without an exception which seems like a very odd way to test the value. If that was the purpose, the code would be a lot clearer to just check for the expected legal values explicitly rather than some sort of undocumented side effect test like this. Plus we don't see any exception handlers to handle bad data here so it seems less likely that would be the reason for it.

I guess one other reason would be to normalize a string to a canonical format since calling JSON.stringify() on the results of parsing it will guarantee a uniform string no matter what escape characters might have been in the original string. It still seems a bizarre practice without any comments about why it's being done.

• mplungjan: I think it may be to allow for the string to contain special chars
• jfriend00: @mplungjan - Yeah, I suppose it could be to make the string canonical, no matter what escape chars were in it. I added that to my answer, but it still seems like a poor practice without at least commenting why it's being done.
• marzelin: JSON.stringify() is commonly used inside of webpack.DefinePlugin() to statically replace a variable with a string. Without stringifying (or adding extra quotes, ie "'production'") it would replace the variable with another identifier and not a string. JSON.parse() seems like some kind of a value test, since desired values are 0 and 1 here. Although I'm still not 100% sure what's Pete's intention behind this code, your answer is certainly helpful. Thanks.