- npm init 创建文件夹,初始化npm 环境
- 安装各种包 npm install webpack webpack-dev-server style-loader css-loader url-loader babel-loader sass-loader file-loader
- 创建webpack.config.js
var path =require("path");
module.exports = {
entry: path.join(__dirname, './src/entry.js'),
output: {
path: path.join(__dirname, 'out'),
publicPath: "./out/",
filename: 'bundle.js',
publicPath: "/assets/"
},
module: {
loaders: [
{test: /\.js$/, loader: "babel"},
{test: /\.css$/, loader: "style!css"},
{test: /\.(jpg|png)$/, loader: "url?limit=8192"},
{test: /\.scss$/, loader: "style!css!sass"}
]
}
};
package.json 添加启动脚本
"scripts": {
"start": "webpack-dev-server --inline --content-base src/"
}
运行
npm run start
访问
http://localhost:8080/
react dev server 热部署 环境搭建完成
参考文档
http://webpack.github.io/docs/webpack-dev-server.html(官网)