Fixes HMR

[eliperelman]

https://github.com/gaearon/react-hot-loader/tree/next/docs

[helfi92]

@eliperelman The reason treeherder-manifest is blowing up is because you are missing some react hot loader setup in that repository and by default we are allowing react-hot-loader.

To solve this issue, you will need to have a special setup.

First, you will need to have <AppContainer> component and then have an if statement to see if it's using react-hot-loader and accept it if it's in development. See this file

Second, if an application is using react-router, then there's some extra setup. See this file to see how to handle routes.

If you're simply trying to test HMR, you can clone helfi92/neutrino-test and do yarn && yarn neutrino neutrino-preset-react && yarn run start You will probably also want to link it to your local webpack-chain.

[helfi92]

Can you replicate the issue you are having with helfi92/neutrino-test?

[eliperelman]

@helfi92 I've got some weirdness going on that is causing issues. In my yarn.lock:

react-hot-loader@3.0.0-beta.6:
  version "3.0.0-beta.6"
  resolved "https://registry.yarnpkg.com/react-hot-loader/-/react-hot-loader-3.0.0-beta.6.tgz#463fac0bfc8b63a8385258af20c91636abce75f4"
  dependencies:
    babel-template "^6.7.0"
    global "^4.3.0"
    react-deep-force-update "^2.0.1"
    react-proxy "^3.0.0-alpha.0"
    redbox-react "^1.2.5"
    source-map "^0.4.4"

If I go into packages/neutrino-preset-react/node_modules/react-hot-loader/package.json:

"version": "1.3.0",

wtf.

I'm not sure how yarn installed this crap version of react-hot-loader, but I'll see if I can fix it.

[helfi92]

So weird, ew!

[eliperelman]

Wow, so every time I would install react-hot-loader@next into treeherder-manifest, it would replace the react-hot-loader in the react preset with the stable version because it was linked. I don't know how it happens, but I just injected the correct version manually using npm and it worked! Ugh....

[eliperelman]

This line is temporary until oao fixes missing line endings in re-writing package.jsons.

[eliperelman]

FYI, here is what my index.js file looks like now inside treeherder-manifest:

import React from 'react';
import { render } from 'react-dom';
import { AppContainer } from 'react-hot-loader';
import App from './ui/App';

const load = () => {
  render((
    <AppContainer>
      <App />
    </AppContainer>
  ), document.getElementById('root'));
};

if (module.hot) {
  module.hot.accept('./ui/App', load);
}

load();