react开发

webpack.config.js

var webpack=require("webpack");
var htmlWebpackPlugin=require('html-webpack-plugin');
var ExtractTextPlugin=require('extract-text-webpack-plugin');
var openBoweserPlugin=require('open-browser-webpack-plugin');

module.exports={
    entry:'./src/script/app.js',
    output:{
        path:__dirname+'/build',
        filename:'app.js'
    },
    devServer:{
        contentBase:'./build',
        host:'localhost',
        port:5000,
        historyApiFallback:false,
        proxy:{
            '/api':{
                target:'http://localhost:9000',
                pathRewrite:{
                    '^/api':''
                },
                changeOrigin:true
            }
        }
    },
    module:{
        loaders:[
             {
                test: /\.css$/,
                loader: ExtractTextPlugin.extract({
                  fallback: 'style-loader',
                  use: 'css-loader'
                })
            },
            {
                test:/\.scss$/,
                loader:ExtractTextPlugin.extract({
                    fallback:'style-loader',
                    use:'css-loader!sass-loader'
                })
            },
              {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'react-hot-loader!babel-loader'
              }

        ]
    },
    plugins:[
        new htmlWebpackPlugin({
            filename:'index.html',
            template:'./src/index.ejs',
            title:'联连Life'
        }),
        new ExtractTextPlugin({
            // filename:'app_[hash].css',
            filename:'app.css',
            disable:false,
            allChunks:true
        }),
//        new webpack.optimize.UglifyJsPlugin({
//            compress:{
//                warnings:false
//            },
//            output:{
//                comments:false
//            }
//        }),
        new openBoweserPlugin({url:'http://localhost:5000'})
    ],
    externals:{
        'react':'window.React',
        'react-dom':'window.ReactDOM',
        'react-router':'window.ReactRouter',
        'redux':'window.Redux'
    }

}

.babelrc

{
"presets":["es2015","react","stage-0"],
"plugins": [
   ["transform-runtime", {
     "polyfill": false,
     "regenerator": true
   }]
 ]

}

package.json

{
  "name": "dev",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack-dev-server"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.24.0",
    "babel-loader": "^6.4.1",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-preset-es2015": "^6.24.0",
    "babel-preset-react": "^6.23.0",
    "babel-preset-stage-0": "^6.22.0",
    "babel-runtime": "^6.23.0",
    "classnames": "^2.2.5",
    "css-loader": "^0.27.3",
    "extract-text-webpack-plugin": "^2.1.0",
    "html-webpack-plugin": "^2.28.0",
    "node-sass": "^4.5.1",
    "open-browser-webpack-plugin": "^0.0.5",
    "react-addons-pure-render-mixin": "^15.4.2",
    "react-addons-shallow-compare": "^15.4.2",
    "react-hot-loader": "^1.3.1",
    "react-tap-event-plugin": "^2.0.1",
    "sass-loader": "^6.0.3",
    "style-loader": "^0.16.0",
    "transform-runtime": "^0.0.0",
    "webpack": "^2.3.1",
    "webpack-dev-server": "^2.4.2"
  },
  "dependencies": {
    "babel-polyfill": "^6.23.0",
    "react": "^15.4.2",
    "react-dom": "^15.4.2",
    "react-redux": "^5.0.3",
    "react-router": "^3.0.2",
    "redux": "^3.6.0"
  }
}