React +webpack 基础配置

首先确保安装了node.js,我们使用npm下载模块依赖

1.新建一个文件夹作为demoApp根目录

2. $ npm init 创建package.json
3. 创建基础文件windows下 cmd  cd.> app.jsx  cd.>webpack.config.js  cd.>main.js  cd.>index.html

4.配置webpack.config.js

var config = {
//指定打包的入口文件
entry: './main.js',
//配置打包的结果,path定义输出的文件夹,filename定义了打包结果文件的名称
output: {
path:'./',
filename: 'index.js',
},
//设置服务器端口号
devServer: {
inline: true,
port: 7999
},

module: {
loaders: [{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel',
query: {
presets: ['react', 'es2015']
}
}]
}

}

module.exports = config;

5.安装依赖 

$ npm install --save-dev react react-dom
$ npm install --save-dev babel-core babel-loader babel-preset-es2015 babel-preset-react
$ npm install --save-dev webpack webpack-dev-server
将scripts中start修改为webpack-dev-server --hot

6.启动 $ npm start