react-router 路由参数问题

Question

第一个City的跳转没问题，
第二个detail1，打开新页面，路由显示正确，页面出现404错误，
第三个detail2，当前页面跳转，路由显示正确，页面显示正确组件，但是刷新会出现404错误

demo地址，希望有人可以指导一下，不知道哪里出问题了

Home组件

export default class Home extends React.Component {

  render() {
    return(
      <div>
        <div>Home</div>
        <Link to="/City">City</Link><br/>
        <Link to="/detail/1234" target="_blank">detail1</Link><br/>
        <Link to="/detail/1234">detail2</Link>
      </div>
    )
  }

}

路由配置

export default class AppRouter extends Component {
  constructor(props) {
    super(props)
  }

  render() {
    return (
      <Router>
          <div>
            <div>Header</div>
            <Switch>
              <Route exact path="/" component={Home}/>
              <Route path="/city" component={City}/>
              <Route path="/detail/:abc" component={City}/>
            </Switch>
            <div>footer</div>
          </div>
      </Router>
    )
  }
}

Answer 1

index.html中引入bundle.js为相对路径，detail1在新窗口打开，请求的js变成了http://localhost:8080/detail/bundle.js， detail2刷新的时候也是这样的

PS：遇到问题，先打开f12查看到底是什么问题，不要急躁，一步步排查。

index.html中引入js文件修改一下,将

<script src="bundle.js"></script>

修改为

<script src="/bundle.js"></script>

Answer 2

<Link to="/detail／1234">detail2</Link> 这里是不是有个符号打错了...