用node.js生成react文件确实很方便，里边的包都会自动装好，不用再手动安装，配置webpack的时候也很简单，但是由于网上的webpack教程大多都是在建立一个空项目文件夹的前提下的。这样对于像我这样的新手来说真的是非常浪费时间，还有可能遇到各种错误。
很多小伙伴都会觉得用npm start 打开react 文件很麻烦，就想要像打开html文件一样，直接在浏览器端打开react项目中的htnl文件，就能看到react的效果，这当然也是可以用webpack实现的。
1.首先在根目录下新建一个webpack.config.js文件（用node.js 已经生成一个完整的react项目并且已经下载webpack）
生成react项目代码：
cnpm install -g create-react-app
create-react-app my-app
cd my-app/
npm start
配置文件webpack.config.js内容：
module.exports = {entry: __dirname +"/src/index.js",
output: {path: __dirname +"/public",
filename:"bundle.js"
},
devtool:'eval-source-map',
devServer: {contentBase:"./public",
historyApiFallback:true,
inline:true
},
module: {
rules: [
{test:/(\.jsx|\.js)$/,
use: {loader:"babel-loader",
options: {
presets: ["env", "react" ] }
},
exclude:/node_modules/
},
{test:/\.css$/,
use: [
{loader:"style-loader" },
{loader:"css-loader" } ]
}]
}
};
入口文件(entry)的设置必须是顶级组件的路径
2.初始化项目
npm init
3.打包
webpack
4.然后你就可以直接运行index.html文件
