极客观点
项目管理
HarmonyOS
1.首先搭建这个项目是作为自己将要学习一下react的环境，最好是按照比较标准的流程走
2.下面简单说一下希望有的功能
通过bebel 实现es6的语法
通过webpack-dev-server实现热更新
在出错的时候可以不用打开控制台查看，而是在页面上变为红色，并且显示出错误
可以通过webpack的html-plugin插件可以生成一个html文件，并且引入JS文件，并且生成出来的HTML文件可以已link的方式引入一个通用类型的.css文件
这边是我创建的文件目录，src（源文件） dist(编译后的文件)
src目录下的main.js是入口文件，而编译后的文件是生成在dist目录下面
现在src目录同级的index.html是我手动创建的，在这个HTML文件里面手动引入的index.js
下面是我webpack.config.js的配置信息
module.exports = {
entry: __dirname + "/src/main.js",
output:{
//输出路径
path: __dirname + "/dist",
//输出文件名
filename:"index.js",
},
devServer:{
contentBase:"./", //设置根目录
host:"192.168.1.102", //主机的ip地址
port:"8888", //端口
color:true //输出的代码是有颜色的
},
module: {
loaders: [
{
test: /\.jsx?$/,
loader: 'babel-loader',
exclude: /node_modules/,
query: {
presets: ['es2015','react']
}
}
]
}
};在这个config文件下，我手动执行webpack命令文件是可以编译的（ES6会变为ES5），这样是不会报错的，但是没有热更新的功能，希望大神可以在我这个webpack.config配置文件基础上修改，可以达到我想要的效果.
PS:这边没有写`plugins:[
new webpack.HotModuleReplacementPlugin()
]`是因为当我执行webpack-dev-server --hot --inline的时候会报错，查了原因是因为这个机制不支持react有的相关语法，所以不能热更新。希望大神可以帮帮忙，解解惑，最好是可以在webpack.config配置项上写上注释，谢谢!
下面贴上package.json项目依赖情况（有些插件装了貌似也不大会用）
{
"name": "react-demo",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"babel-core": "^6.21.0",
"babel-loader": "^6.2.10",
"babel-plugin-react-transform": "^2.0.2",
"babel-preset-es2015": "^6.18.0",
"babel-preset-react": "^6.16.0",
"react": "^15.4.2",
"react-dom": "^15.4.2",
"react-hot-loader": "^1.3.1",
"react-transform-catch-errors": "^1.0.2",
"react-transform-hmr": "^1.0.4",
"redbox-react": "^1.3.3",
"webpack": "^1.14.0",
"webpack-dev-server": "^1.16.2"
}
}希望最好可以在代码上写上注释，这样我也会看的比较明白！谢谢大家
如果不需要热加载的话 create-react-app 应该可以满足你的要求。
最近我自己整理一个项目模板，基本上基于 create-react-app 实现改进的，可以满足你的所有要求。
https://github.com/zhbhun/rea...
通过 babel 实现es6的语法
支持 ESLint 做代码检查
支持 React 和 Redux 热加载，实现局部更新
开发服务器支持第三方模块预构建，启动速度快，热加载时间短（小型项目基本在 200 毫秒左右，稍微复杂的也能保证在 1 秒内），代码修改后局部刷新不会存在延迟问题
友好的错误提示：出现语法错误时，服务器控制台和前端网页都显示相关的错误信息；
友好的 Webpack 日志信息：支持显示进度条，解决开发服务器日志信息不友好的问题；
生产环境支持第三方库提取，支持 HTML 生成，CSS 样式文件生成；
PS：使用文档写的不够完善，使用方式也还不够友好，暂时没有优化的打算，推荐看下模板里面的配置实现方式，从中可以学习许多 webpack 的配置知识，有问题可以提 ISSUE，尽量解答。