Javascript 无法正确设置路由器Dom

您好，我目前正在使用

react-router-dom

。我似乎没有正确遵循说明，因为我遇到了以下问题：

bundle.js:1085 Warning: Failed prop type: The prop `history` is marked as required in `Router`, but its value is `undefined`.
  in Router

bundle.js:2279 Uncaught Error: A <Router> may have only one child element
    at invariant (bundle.js:2279)
    at Router.componentWillMount (bundle.js:47987)
    at bundle.js:35732
    at measureLifeCyclePerf (bundle.js:35459)
    at ReactCompositeComponentWrapper.performInitialMount (bundle.js:35731)
    at ReactCompositeComponentWrapper.mountComponent (bundle.js:35642)
    at Object.mountComponent (bundle.js:41991)
    at ReactCompositeComponentWrapper.performInitialMount (bundle.js:35755)
    at ReactCompositeComponentWrapper.mountComponent (bundle.js:35642)
    at Object.mountComponent (bundle.js:41991)

main.js：

"use strict";
const React = require('react');
const ReactDOM = require('react-dom');
const BrowserRouter = require('react-router-dom').BrowserRouter;
const App = require('./components/app');

ReactDOM.render(<BrowserRouter> <App /> </BrowserRouter>, document.getElementById('app'));

“严格使用”；
const React=require（'React'）；
const ReactDOM=require（'react-dom'）；
const BrowserRouter=require（'react-router-dom'）。BrowserRouter；
const-App=require（'./组件/App'）；
ReactDOM.render（，document.getElementById（'app'））；

app.js：

$ = jQuery = require('jquery');
const React = require('react');
const Header = require('./common/header');
const Routes = require('../routes');

class App extends React.Component {
    render() {
        return (
            <div>
                <Header />
                <Routes />
            </div>  
        );
    }
}

module.exports = App;

$=jQuery=require（'jQuery'）；
const React=require（'React'）；
const Header=require（“./common/Header”）；
const Routes=require（“../Routes”）；
类应用程序扩展了React.Component{
render（）{
返回(
);
}
}
module.exports=App；

更新1:

我删除了routes.js中的

包装，第一个错误消失了。感谢：@Keith Alpichi首先是。导入

createBrowserHistory

然后创建它

import createBrowserHistory from 'history/createBrowserHistory'

const history = createBrowserHistory()

<Router history={history}>
  <App/>
</Router>

---

所以我应该只留下

？

import createBrowserHistory from 'history/createBrowserHistory'

const history = createBrowserHistory()

<Router history={history}>
  <App/>
</Router>

const Routes = (
  <Switch>
    <Route exact path="/" component={Home} />
    <Route path="/authors" component={AuthorPage} />
    <Route path="/about" component={About} />
  </Switch>
);