{
  "$type": "site.standard.document",
  "canonicalUrl": "https://johnnyreilly.com/posts/its-not-dead-2-mobx-react-devtools-and-the-undead",
  "description": "Using `mobx-react-devtools` with `process.env.NODE_ENV` caused problems with webpack production mode. A different approach fixed the issue.",
  "path": "/posts/its-not-dead-2-mobx-react-devtools-and-the-undead",
  "publishedAt": "2018-03-26T00:00:00.000Z",
  "site": "at://did:plc:yy3apqjlms24kso7ahn7lbmb/site.standard.publication/3mova7c4nho2b",
  "tags": [
    "webpack"
  ],
  "textContent": "I spent today digging through our webpack 4 config trying to work out why a production bundle contained code like this:\n\nMy expectation was that with webpack 4 and 'mode': 'production' this meant that behind the scenes all process.env.NODE_ENV statements should be converted to 'production'. Subsequently Uglify would automatically get its groove on with the resulting if(\"production\"!==\"production\") ... and et voilà!... Strip the dead code.\n\nIt seemed that was not the case. I was seeing (regrettably) undead code. And who here actually likes the undead?\n\n\n\nWho Betrayed Me?\n\nMy beef was with webpack. It done did me wrong. Or... So I thought. webpack did nothing wrong. It is pure and good and unjustly complained about. It was my other love: mobx. Or to be more specific: mobx-react-devtools.\n\nIt turns out that the way you use mobx-react-devtools reliably makes the difference. It's the cause of the stray (\"production\"!==e.env.NODE_ENV) statements in our bundle output. After a long time I happened upon this issue which contained a gem by one Giles Butler. His suggested way to reference mobx-react-devtools is (as far as I can tell) the solution!\n\nOn a dummy project I had the mobx-react-devtools advised code in place:\n\nWith this I had a build size of 311kb. Closer examination of my bundle revealed that my bundle.js was riddled with (\"production\"!==e.env.NODE_ENV) statements. Sucks, right?\n\nThen I tried this instead:\n\nWith this approach I got a build size of 191kb. This was thanks to the dead code being actually stripped. That's a saving of 120kb!\n\nPerhaps We Change the Advice?\n\nThere's a suggestion that the README should be changed to reflect this advice - until that happens, I wanted to share this solution. Also, I've a nagging feeling that I've missed something pertinent here; if someone knows something that I should... Tell me please!",
  "title": "It's Not Dead 2: mobx-react-devtools and the undead"
}