安装
1.安装create-react-app
npm install -g create-react-app
2.创建项目
create-react-app my-app
配置
1.弹出配置文件
npm run eject
2.安装React Hot Loader
npm install --save-dev react-hot-loader@next
3.添加babel插件
1 2 3 4 |
"plugins": [ "react-hot-loader/babel" ] |
最终package.json里的babel配置如下:
1 2 3 4 5 6 7 8 9 10 |
"babel": { "presets": [ "react-app", "stage-1" ], "plugins": [ "react-hot-loader/babel" ] }, |
4. webpack.config.dev.js 添加如下入口
'react-hot-loader/patch'
5. 修改index.js入口文件
-
import { AppContainer } from 'react-hot-loader'; const render = (Component) => { ReactDOM.render( <AppContainer> <Component/> </AppContainer>, document.getElementById('root') ); }; render(App); // 模块热替换的 API if (module.hot) { module.hot.accept('./App', () => { render(App) }); }