1.根目录下建一个webpack.dev.js,设置好入口出口文件等内容。
2.npm init,生成package.json,其中会显示你所安装的依赖,然后对应可以找出少了哪些你需要的依赖。
3.安装缺少的react包。
npm install --save react react-dom
npm install --save-dev webpack babel-cli babel-loader babel-preset-es2015 babel-preset-react
4.修改package.json里面的scripts:
“scripts”:{
“dev”:“webpack --config webpack.dev.js”
}
到这边,webpage和react的基本配置就完成了。如果想要实现热替换的话,接下来的步骤可以实现。
1.用webpage创建一个本地服务器。
npm webpack-dev-server html-webpack-plugin --save-dev
2.修改package.json里面的scripts:
“scripts”:{
“dev”:“webpack-dev-server --config webpack.dev.js”
}
3.安装react-hot-loader:
npm install --save-dev react-hot-loader
4.更改webpack.dev.jsh和.babelrc的配置,这里主要是记录流程。具体变更内容就不贴出来了。
5.最后npm run dev就可以启动热替换了。
以上内容不是很完善,为了自己方便记忆和整理流程写的。如果有错误,敬请指出。
参考文档链接:
http://www.ruanyifeng.com/blog/2015/03/react.htm
https://github.com/varHarrie/YmxvZw/issues/14
---------------------
作者:嘴角的面包屑
来源:CSDN
原文:https://blog.csdn.net/sinat_41218003/article/details/79021879