react-loadable 無效

環(huán)境：webpack4 react 等都是最新的依賴！

import React from 'react';
import {
  BrowserRouter,
  Route,
  Link,
  Switch,
  HashRouter
} from 'react-router-dom'

import Loadable from 'react-loadable';
import Loading from './loading.jsx';
//主入口文件
import App from '../app.jsx';

//路由 頁面 的加載（推薦單文件的寫法）

//demos 通過打包 控制 只在開發(fā)環(huán)境中生效！
import Demo from '../pages/demos/demo.jsx';

//pages
import Search from '../store/container/searchContainer';
import ShopDetail from '../store/container/shopDetailContainer';
import AllShopList from '../pages/allShopList/allShopList.jsx';
import BrandDetail from '../pages/brandDetail/brandDetail.jsx';
import CouponDetail from '../store/container/couponDetailContainer';
import MyCollection from '../pages/myCollection/myCollection.jsx';

//懶加載方式
const SearchLazy = Loadable({
  loader: () => import('../store/container/searchContainer'),//
  loading: () => Loading,
})

// 路由配置
const routes = [
  {path: "/", text: "search", component: SearchLazy}, //這個無效！
  //{path: "/", text: "search", component: Search },
  {path: "/couponDetail", text: "couponDetail", component: CouponDetail},
  {path: "/search", text: "search", component: Search },
  {path: "/shopDetail", text: "shopDetail", component: ShopDetail},
  {path: '/demo', text: "demo", component: Demo},
  {path: '/allShopList', text: "allShopList", component: AllShopList},
  {path: '/brandDetail', text: "brandDetail", component: BrandDetail},
  {path: '/myCollection', text: "myCollection", component: MyCollection}
];


//@formatter:off
const AppRouter = () => (
  <HashRouter>
    <App>
      {
        routes.map((page, index) => page.component ?
          <Route key={index} exact path={page.path} component={page.component}/> : "")
      }
    </App>
  </HashRouter>
);
//@formatter:on

export default AppRouter;