webpack4 react局部热加载

1、下载
	cnpm install -D react-hot-loader
	在devServer中开启hot:true
	
2、配置
	创建.babelrc文件,在"plugins"的数组中最顶层添加
	"plugins": ["react-hot-loader/babel"]
	
	方式一:
		import { hot } from 'react-hot-loader/root';	确保在react和react-dom之前引入
		
		export default hot(需要局部热加载的组件);		
		将需要的组件通过hot高阶函数包裹,函数内部实现了这样的方法
			if (module.hot) {
			  module.hot.accept('./App', () => {
			    const NextApp = require('./App').default;	因为在App里使用的是export default语法，这里使用的是require,默认不会加载default的，所以需要手动加上
			    render(NextApp);
			  })
			}
	方式二:
		(1)修改entry入口
			entry:[
			    'react-hot-loader/patch',
			    主入口文件,
			]
		(2)添加plugins
			new webpack.hotModuleReplacementPlugin(),
			
		(3)修改项目主入口文件
		
			import { AppContainer } from 'react-hot-loader';
			...
 
			const render = Component => {
			  ReactDOM.render(
			    <Provider store={store}>
			      <AppContainer>
			        <Component />
			      </AppContainer>
			    </Provider>, 
			    document.getElementById('root'));
			}
			 
			 
			render(App);
			 
			if (module.hot) {
			  module.hot.accept('./App', () => {
			    //因为在App里使用的是export default语法，这里使用的是require,默认不会加载default的，所以需要手动加上
			    const NextApp = require('./App').default;
			    // 重新渲染到 document 里面
			    render(NextApp);
			  })
			}