如何用 "babel-preset-react-hmre": "^1.1.1",实现代码热加载_course

我在配置读react全栈这本书时，按照书上面的进行配置，但是出现不了描述的效果 我的package.json代码为: { "name": "react_webpack", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "build": "webpack", "dev": "webpack-dev-server --hot", "start": "webpack-dev-server --hot --inline" }, "author": "jkwu", "license": "ISC", "devDependencies": { "babel-core": "^6.23.1", "babel-loader": "^6.3.0", "babel-plugin-react-transform": "^2.0.2", "babel-preset-es2015": "^6.22.0", "babel-preset-react": "^6.23.0", "babel-preset-react-hmre": "^1.1.1", "css-loader": "^0.26.1", "eslint": "^3.15.0", "eslint-config-airbnb": "^14.1.0", "eslint-loader": "^1.6.1", "eslint-plugin-import": "^2.2.0", "eslint-plugin-jsx-a11y": "^4.0.0", "eslint-plugin-react": "^6.9.0", "file-loader": "^0.10.0", "html-webpack-plugin": "^2.28.0", "react-transform-catch-errors": "^1.0.2", "react-transform-hmr": "^1.0.4", "redbox-react": "^1.3.3", "style-loader": "^0.13.1", "url-loader": "^0.5.7", "webpack": "^2.1.0-beta.21", "webpack-dev-server": "^2.1.0-beta.1" }, "dependencies": { "babel-polyfill": "^6.6.1", "react": "^15.4.2", "react-dom": "^15.4.2" } } webpack.config代码为： var path=require('path'); var webpack=require('webpack'); var HtmlWebpackPlugin=require('html-webpack-plugin'); //一些常用路径 var ROOT_PATH=path.resolve(__dirname); var APP_PATH=path.resolve(ROOT_PATH,'app'); var BUILD_PATH=path.resolve(ROOT_PATH,'build'); // console.log("ROOT_PATH====="+ROOT_PATH); // console.log("APP_PATH====="+APP_PATH); // console.log("BUILD_PATH====="+BUILD_PATH); module.exports={ entry:{ //注意这里教材中使用的是index.jsx app:path.resolve(APP_PATH,'app.jsx') }, output:{ path:BUILD_PATH, filename:'bundle.js' }, //开启 dev source map devtool:'eval-source-map', //开启 webpack dev server devServer:{ historyApiFallback: true, hot: true, inline: true, progress: true, port:9999 //端口你可以自定义 //contentBase是访问路径，设置这个的话没图片会访问不到，如果html文件和css img等文件打包后都在这个路径下是没有问题，否则会找不到文件的 }, module: { // 配置preLoaders,将eslint添加进入 preLoaders: [ { test:/\.jsx?$/, loaders:['eslint'], include:APP_PATH } ], // rules: [ // { // test:/\.jsx?$/, // include:APP_PATH, // enforce: 'pre', // use: [{loader: 'eslint-loader', options: {rules: {semi: 0}}}], // }, // // other rules // ], // 配置loaders,将babel添加进去 loaders:[ { test:/\.jsx?$/, loaders:['babel-loader'], include:APP_PATH }, { test:/.(png)|(jpg)$/, loaders:['url'], include:APP_PATH }, { test:/.css$/, loaders:['style','css'], include:APP_PATH } ] }, //配置plugin plugins:[ new HtmlWebpackPlugin({ title:'My first react app' }) ], resolve:{ extensions:['','.js','.jsx'] } } .babelrc文件为： { "presets": ["es2015","react"], "env": { "development":{ "presets":["react-hmre"] } } } nodejs版本为 jkwu@jkwu:~/Projects/React_Webpack$ nodejs -v v4.2.6 jkwu@jkwu:~/Projects/React_Webpack$ node -v v6.9.4 jkwu@jkwu:~/Projects/React_Webpack$

react下载,包括react.development.js;babel.min.js;react-dom.development.js_course

包括react.development.js;babel.min.js;react-dom.development.js三个js文件 相关下载链接：//download.csdn.net/downlo