ReactJS重新加载返回空白页

Question

我目前正在开发ReactJS应用程序，并且使用热重载。每当我重新编译应用程序时，它将使我空白页，并且需要返回到要呈现的UI的基本URL。这是我的webpack配置：

'use strict';

const path = require('path');
const webpack = require('webpack');
const merge = require('webpack-merge');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

const nodeEnv = process.env.NODE_ENV || 'development';

const commonConfig = {

  resolve: {
    modules: [path.resolve('./src'), 'node_modules'],
    extensions: ['.js', '.csv', '.json', '.scss', '.css', '.html']
  },


  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        enforce: 'pre',
        use: [{ loader: 'eslint-loader', options: { configFile: '.eslintrc' } }]
      },
      {
        use: 'babel-loader',
        test: /\.js$/,
        exclude: /node_modules/
      },
      {
        test: /\.html$/,
        use: [{ loader: 'htmlhint-loader', options: { configFile: '.htmlhintrc' } }],
        exclude: /node_modules/,
        enforce: 'pre'
      },
      {
        test: /\.(png|jpg|jpeg|svg|gif|svg|woff|woff2|ttf|eot)(\?v=\d+\.\d+\.\d+)?$/,
        use: 'file-loader'
      },
      {
        use: [{
          loader: 'html-loader'
        }],
        test: /\.html$/
      }
    ]
  },
  plugins: [
    new webpack.DefinePlugin({
      'process.env': {
        NODE_ENV: JSON.stringify(nodeEnv)
       }
    }),
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      minChunks: function (module) {
        if (module.resource && (/^.*\.(css|less|scss)$/).test(module.resource)) {
          return false;
        }
        return module.context && module.context.indexOf('node_modules') !== -1;
      }
    }),
    new webpack.optimize.CommonsChunkPlugin({
      name: 'manifest',
      minChunks: Infinity
    }),
    new CopyWebpackPlugin([{
      from: __dirname + '/src/images',
      to: ''
    }]),
    new HtmlWebpackPlugin({
      template: 'src/index.html',
      chunksSortMode: 'dependency'
    }),
    new webpack.optimize.ModuleConcatenationPlugin()
  ]
};


const devConfig = {
  entry: {
    main: ['whatwg-fetch', 'core-js/es6', 'react-hot-loader/patch', 'index.js',
      'webpack-hot-middleware/client?reload=true']
  },

  target: 'web',

  devtool: 'inline-source-map',

  output: {
    path: path.join(__dirname, '/build'),
    filename: '[name].bundle.js',
    publicPath: '/'
  },

  module: {
    rules: [
      {
        test: /\.scss/,
        include: path.resolve(__dirname, 'src/styles'),
        use: ['style-loader', 'css-loader', {loader: 'sass-loader', options: {sourceMap: true}}]
      },
      {
        test: /\.css$/,
        exclude: [/node_modules/],
        use: ['style-loader', 'css-loader?modules']
      },
      {
        test: /\.css$/,
        include: [/node_modules/],
        use: ['style-loader', 'css-loader']
      }
    ]
  },

  devServer: {
    contentBase: 'src',
    compress: true,
    hot: true,
    port: 3xxx,
    host: '0.0.0.0',
    disableHostCheck: true,
    historyApiFallback: {
      disableDotRule: true,
      index: 'build/index.html'
    },
    stats: 'minimal',
    overlay: true,
    proxy: {
      '/api/**': {
        target: {
          port: 8xxx
        },
        secure: false
      },
      '/actuator/**': {
        target: {
          port: 8xxx
        },
        secure: false
      },
    }
  },

  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NamedModulesPlugin(),
    new webpack.NoEmitOnErrorsPlugin()
  ]
};

const prodConfig = {
  entry: {
    main: ['whatwg-fetch', 'core-js/es6', 'index.js']
  },

  devtool: 'source-map',

  output: {
    path: path.join(__dirname, '/build'),
    filename: '[name].[hash].bundle.js',
    publicPath: '/myModule/'
  },

  module:  {
    rules: [
      {
        test: /\.scss/,
        use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: [
            'css-loader',
            {loader: 'sass-loader', options: {sourceMap: true}}
          ]
        })
      },
      {
        test: /\.css$/,
        exclude: [/node_modules/],
        use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: 'css-loader?modules'
        })
      },
      {
        test: /\.css$/,
        include: [/node_modules/],
        use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: 'css-loader'
        })
      }
    ]
  },

  plugins: [
    new ExtractTextPlugin({filename: '[name].[hash].css'}),
    new webpack.NoEmitOnErrorsPlugin()
  ]
};

const drConfig = {
  entry: {
    main: ['whatwg-fetch', 'core-js/es6', 'index.js']
  },

  devtool: 'source-map',

  output: {
    path: path.join(__dirname, '/dr_build'),
    filename: '[name].[hash].bundle.js',
    publicPath: '/myModule/'
  },

  module:  {
    rules: [
      {
        test: /\.scss/,
        use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: [
            'css-loader',
            {loader: 'sass-loader', options: {sourceMap: true}}
          ]
        })
      },
      {
        test: /\.css$/,
        exclude: [/node_modules/],
        use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: 'css-loader?modules'
        })
      },
      {
        test: /\.css$/,
        include: [/node_modules/],
        use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: 'css-loader'
        })
      }
    ]
  },

  plugins: [
    new ExtractTextPlugin({filename: '[name].[hash].css'}),
    new webpack.NoEmitOnErrorsPlugin()
  ]
};

let config;
switch (nodeEnv) {
  case 'production':
    console.info('NODE_ENV: production');
    config = merge(commonConfig, prodConfig);
    break;
  case 'dr':
    console.info('NODE_ENV: dr');
    config = merge(commonConfig, drConfig);
    break;
  default:
    console.info('NODE_ENV: development');
    config = merge(commonConfig, devConfig);
    break;
}

module.exports = config;

我不确定我缺少什么，或者可以从Webpack中添加或删除其他内容。我使用React-router-v4。

谢谢