Webpack Hot Module Reloader not working with React Stateless Component

Viewed 1298

I am having a bit of trouble with webpack-dev-middleware not hot reloading using a react stateless function, but working fine if I create a class extending component.

For instance, this works perfectly.

// home.js

import React from 'react'

export default class Home extends React.Component {
  render() {
    return (
            <div>
                <h1>Drop it like it's hot</h1>
            </div>
        )
  }
}

However, this fails miserably.

// home.js

import React from 'react'

export default function Home() {
  return (
        <div>
            <h1>Hello World</h1>
        </div>
    )
}

Error:

[Warning] [HMR] The following modules couldn't be hot updated: (Full reload needed) (bundle.js, line 1742)
This is usually because the modules which have changed (and their parents) do not know how to hot reload themselves. See http://webpack.github.io/docs/hot-module-replacement-with-webpack.html for more details.
[Warning] [HMR]  - ./client/components/home.js (bundle.js, line 1750)
1 Answers
Related