每当我在本地使用 browserHistory 时，我都没有问题，但是当我在发货之前对其进行测试时，我会得到一个带有错误的空白页面。所以当我用 hashHistory 替换 browserHistory 时一切正常，但我丢失了漂亮的 url。

未捕获的安全错误：无法在“历史”上执行“replaceState”：无法在原点为“null”的文档中创建 URL 为“file:///Users/somefile/work/someproject/index.html”的历史状态对象网址。

const Routes = (
  <Router history={browserHistory}>
    <Route path="/" component={Login} />
    <Route path="/content" component={App} >
      <Route path="/component1" component={component1} />
      <Route path="/component2" component={component2} />
      <Route path="/component3" component={component3} />
    </Route>
  </Router>
);

在我的 index.js 中

const createStoreWithMiddleware = applyMiddleware(ReduxPromise)(createStore);
const store = createStoreWithMiddleware(reducers);

ReactDOM.render(
  <Provider store={store}>
  {Routes}
  </Provider>,
  document.querySelector('.react-internal')
)

在我的 app.js 中

export default class App extends Component {

  render() {
    return (
      <div>
      <Header />
      <div className="container-fluid">
        {this.props.children}
        </div>
      </div>
    );
  }
}

和我的 webpack 文件

var webpack = require('webpack');

module.exports = {
  devtool:'source-map',
  entry: [
    './src/index.js',
  ],
  output: {
    path: __dirname,
    publicPath: '/',
    filename: 'bundle.js'
  },
  module: {
    loaders: [
      {
        exclude: /node_modules/,
        loaders: ['react-hot','babel']
      },
      { test: /\.css$/, loader: "style!css" },
      {
        test: /\.(jpe?g|png|gif|svg)$/i,
        loaders: [
            'file?hash=sha512&digest=hex&name=[hash].[ext]',
            'image-webpack?bypassOnDebug&optimizationLevel=7&interlaced=false'
        ]
      }
    ]
  },
  resolve: {
    extensions: ['', '.js', '.jsx']
  },

  devServer: {
    port:8080,
    historyApiFallback: true,
    contentBase: './'
  }
};