webpack devserver proxy 配置以及react多页面

github地址: https://github.com/yangstar/React-antd-webpack-dev-server

var webpack = require('webpack');
var path = require('path');
var OpenBrowserPlugin = require('open-browser-webpack-plugin');
var glob = require('glob')

//路径定义
var srcDir = path.resolve(process.cwd(), 'react/entries');
var distDir = path.resolve(process.cwd(), 'build');
var htmlDir = path.resolve(process.cwd(), './');
var nodeModPath = path.resolve(__dirname, './node_modules');
var publicPath = '';
//插件定义
var CommonsChunkPlugin = webpack.optimize.CommonsChunkPlugin;
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var UglifyJsPlugin = webpack.optimize.UglifyJsPlugin

//入口文件定义
var entries = function () {
  // var jsDir = path.resolve(srcDir, 'js')
  var entryFiles = glob.sync(srcDir + '/*.{js,jsx}')
  var map = {};

  for (var i = 0; i < entryFiles.length; i++) {
    var filePath = entryFiles[i];
    var filename = filePath.substring(filePath.lastIndexOf('\/') + 1, filePath.lastIndexOf('.'));
    map[filename] = filePath;
  }return map;
}
//html_webpack_plugins 定义
var html_plugins = function () {
  var entryHtml = glob.sync(htmlDir + '/*.html')
  var r = []
  var entriesFiles = entries()
  for (var i = 0; i < entryHtml.length; i++) {
    var filePath = entryHtml[i];
    var filename = filePath.substring(filePath.lastIndexOf('\/') + 1, filePath.lastIndexOf('.'));
    // console.log(entryHtml[i], filename)
    var conf = {
      template: 'html!' + filePath,
      filename: filename + '.html'
    }
    //如果和入口js文件同名
    if (filename in entriesFiles) {
      conf.inject = 'body'
      conf.chunks = ['vendor', filename]
    }
    //跨页面引用，如pageA,pageB 共同引用了common-a-b.js，那么可以在这单独处理
    //if(pageA|pageB.test(filename)) conf.chunks.splice(1,0,'common-a-b')
    r.push(new HtmlWebpackPlugin(conf))
  }
  return r
}

var webpack_config = function (options) {
  options = options || {}
  var debug = options.debug !== undefined ? options.debug : true;

  var plugins = [];

  var extractCSS;
  var cssLoader;
  var sassLoader;

  plugins.push(new CommonsChunkPlugin({
    name: 'vendor',
    minChunks: Infinity
  }));

  if (debug) {
    extractCSS = new ExtractTextPlugin('css/[name].css?[contenthash]')
    cssLoader = extractCSS.extract(['css'])
    sassLoader = extractCSS.extract(['css', 'sass'])

    plugins.push(extractCSS)
  } else {
    extractCSS = new ExtractTextPlugin('css/[contenthash:8].[name].min.css', {
      // 当allChunks指定为false时，css loader必须指定怎么处理
      allChunks: false
    })
    cssLoader = extractCSS.extract(['css?minimize'])
    sassLoader = extractCSS.extract(['css?minimize', 'sass'])

    plugins.push(
      extractCSS,
      new UglifyJsPlugin({
        compress: {
          warnings: false
        },
        output: {
          comments: false
        },
        mangle: {
          except: ['$', 'exports', 'require', 'avalon']
        }
      }),
      new webpack.optimize.DedupePlugin(),
      new webpack.NoErrorsPlugin()
    )
  }

  //config
  var config = {
    devServer: {
      historyApiFallback: true,
      hot: true,
      inline: true,
      progress: true,
      port: 8000,
      header: { "Access-Control-Allow-Origin": "*" },
      contentBase: './', //index.html所在目录
      proxy: {
        '/': {

          target: 'http://10.10.11.100:8081',
          changeOrigin: true,
          secure: false
        }
      }
    },
    entry: Object.assign(entries(), {
      // 用到什么公共lib（例如jquery.js），就把它加进vendor去，目的是将公用库单独提取打包
      'vendor': ['react', 'react-dom']
    }),
    output: {
      path: path.join(__dirname, "/build"),
      filename: "[name].js",
      chunkFilename: '[id].bundle.js',
    },
    module: {
      loaders: [{
        test: /\.css$/,
        loader: 'style-loader!css-loader'
      }, {
        test: /\.js[x]?$/,
        include: path.resolve(__dirname, 'react'),
        exclude: /node_modules/,
        loaders: ['react-hot', 'babel-loader?cacheDirectory'],

      }, {
        test: /\.(png|jpg)$/,
        loader: 'url-loader?limit=8192'
      }, {
        test: /\.(woff|woff2|eot|ttf|svg)(\?.*$|$)/,
        loader: 'url'
      }]
    },
    resolve: {
      extensions: ['', '.js', '.jsx', '.css', '.scss', '.tpl', '.png', '.jpg'],
      root: [srcDir, nodeModPath],
      publicPath: '/',
      alias: {
        InnerForm: __dirname + 'xx.js',
      }
    },
    plugins: plugins.concat(html_plugins(),
      new webpack.NoErrorsPlugin(),
      new OpenBrowserPlugin({
        url: 'http://localhost:8081/dev/index.html'
      })
    )
  }

  return config;
}

module.exports = webpack_config({ debug: true })