Merge pull request #1316 from gaearon/12.11

12.11

Author: theKashey

Diff for: examples/styled-components/src/index.js

@@ -1,9 +1,10 @@
+import 'react-lifecycles-compat';
 import 'babel-polyfill';
 import React from 'react';
 import { render } from 'react-dom';
 import App from './App';
 
-const root = document.createElement('div');
-document.body.appendChild(root);
+//const root = ;
+document.body.appendChild(document.createElement('div'));
 
-render(<App />, root);
+render(<App />, document.getElementsByTagName('div')[0]);

Diff for: examples/styled-components/webpack.config.babel.js

@@ -14,9 +14,24 @@ module.exports = {
   module: {
     rules: [
       {
-        exclude: /packages/, // should work without exclude
+        exclude: /node_modules/, // should work without exclude
         test: /\.js$/,
-        use: ['react-hot-loader/webpack', 'babel-loader'],
+        use: ['babel-loader'],
+      },
+      {
+        include: /node_modules\/react-lifecycles-compat/, // should work without exclude
+        test: /\.js$/,
+        use: ['babel-loader'],
+      },
+      {
+        include: /node_modules\/react-dom/,
+        test: /\.jsx?$/,
+        use: {
+          loader: 'react-hot-loader/webpack',
+          options: {
+            noRegister: true,
+          },
+        },
       },
     ],
   },

Diff for: index.d.ts

@@ -100,6 +100,11 @@ export interface Config {
    */
   disableHotRendererWhenInjected: boolean;
 
+  /**
+   * Show "hot-loader/react-dom" warning
+   */
+  showReactDomPatchNotification: boolean;
+
   /**
    * flag to completely disable RHL for SFC
    */

Diff for: src/babel.dev.js

@@ -10,7 +10,7 @@ const shouldIgnoreFile = file =>
   !!file
     .split('\\')
     .join('/')
-    .match(/node_modules\/(react|react-hot-loader)([\/]|$)/);
+    .match(/node_modules\/(react|react-dom|react-hot-loader)([\/]|$)/);
 
 /* eslint-enable */
 
@@ -40,14 +40,14 @@ function plugin(args, options = {}) {
 
   const headerTemplate = template(
     `(function () {
-       var enterModule = (typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal : require('react-hot-loader')).enterModule;
+       var enterModule = (typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined);
        enterModule && enterModule(module);
      }())`,
     templateOptions,
   );
   const footerTemplate = template(
     `(function () {
-       var leaveModule = (typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal : require('react-hot-loader')).leaveModule;
+       var leaveModule = (typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined);
        leaveModule && leaveModule(module);
      }())`,
     templateOptions,
@@ -61,7 +61,7 @@ function plugin(args, options = {}) {
     `    
 (function () {  
   
-  var reactHotLoader = (typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal : require('react-hot-loader')).default;
+  var reactHotLoader = (typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined);
   
   if (!reactHotLoader) {
     return;

Diff for: src/reactHotLoader.js

@@ -135,6 +135,11 @@ const reactHotLoader = {
   patch(React, ReactDOM) {
     let typeResolver = resolveType;
     /* eslint-disable no-console */
+    if (ReactDOM && !ReactDOM.render) {
+      logger.error(
+        'React-Hot-Loader: broken state detected, please import React-Hot-Loader before react-dom, see https://github.com/gaearon/react-hot-loader/issues/1315',
+      );
+    }
     if (ReactDOM && ReactDOM.setHotElementComparator) {
       ReactDOM.setHotElementComparator(hotComponentCompare);
       configuration.disableHotRenderer = configuration.disableHotRendererWhenInjected;

Diff for: src/webpack/index.js

@@ -36,7 +36,8 @@ function transform(source, map) {
   if (options.withPatch) {
     source = patch(source);
   }
-  if (source.indexOf('reactHotLoader.register') > 0) {
+
+  if (source.indexOf('reactHotLoader.register') > 0 || options.noRegister) {
     return callback(null, source, map);
   }
   // This is a Webpack loader, but the user put it in the Babel config.

Diff for: src/webpack/webpackTagCommonJSExports.js

@@ -4,11 +4,7 @@
 void (function register() {
   // eslint-disable-line no-extra-semi
   /* react-hot-loader/webpack */
-  var safe_require = function() {
-    return typeof require === 'undefined' ? undefined : require('react-hot-loader');
-  };
-
-  var reactHotLoader = (typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal : safe_require()).default;
+  var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;
 
   if (!reactHotLoader) {
     return;