javascript - 使用 react-loadable 拆分代码时的随机块

Question

我react-loadable用来拆分我的代码。我一开始就选择在路线级别执行此操作。我的routes.js样子是这样的：

import React from 'react';
import { Route, Switch } from 'react-router-dom';
import Loadable from 'react-loadable';

const Loading = props => {
  if (props.error) {
    return <div>Error loading page!</div>;
  } else {
    return null;
  }
};

const AsyncHomepage = Loadable({ loader: () => import('../Scenes/Homepage/Homepage' /* webpackChunkName: "homepage" */), loading: Loading });
const AsyncSearchPage = Loadable({ loader: () => import('../Scenes/Search/Search' /* webpackChunkName: "search" */), loading: Loading });
const AsyncAboutUsPage = Loadable({ loader: () => import('../Scenes/AboutUs/AboutUs' /* webpackChunkName: "aboutus" */), loading: Loading });

// omitted for brevity

export const Routes = () => {
  return (
    <Switch>
      <Route exact path="/" component={AsyncHomepage} />
      <Route exact path="/search" component={AsyncSearchPage} />
      <Route exact path="/about-us" component={AsyncAboutUsPage} />

      // omitted for brevity
    </Switch>
  );
};

这是我唯一使用的地方react-loadable。

当我构建应用程序时，我得到了我的命名块，但我也得到了一堆随机编号的块：

这些其他块似乎包含诸如moment.js,之类react-select的内容，还有另一个包含react-dom肯定会包含在每个页面中的内容？

我想知道为什么会发生这种情况以及如何命名这些块或将它们与页面块合并？