关于react-router-dom 和 react-router-config 的配合使用问题

今天尝试在react项目中使用react-router-dom和react-router-config搭建路由出现报错

报错内容：

Error: Invariant failed: You should not use <Switch> outside a <Router>

原因是：没有在外部使用BrowserRouter进行包裹

正确的使用方法:

routes.js

import Layout from "../components/Layout/index"

const routerList: any = [
    {
        path:'/',
        component:Layout
    }
]

export default routerList

App.jsx

import React from 'react';
import './App.css';
import routerList from './routers';
import {BrowserRouter as Router} from 'react-router-dom'
import {renderRoutes} from 'react-router-config'

function App() {
  return (
    <Router>  //+++ 需要使用BrowserRouter包裹
     <div className="App">
      {renderRoutes(routerList)}
    </div>
    </Router> //+++ 需要使用BrowserRouter包裹
   
  );
}

export default App;