带有组件导入的行为怪异

Question

我有一个像这样使用的组件映射

import {InfoCard} from '@components/base';

const componentMap: ComponentMapping = {
  controlledTable: ControlledTable,
  infoCard: InfoCard,
};

...

const Component: React.ComponentClass = componentMap[data.class];
return <Component {...data.props} />;

信息卡是@components/base/info_card.tsx的默认导出，并且像@components/base/index.tsx一样从export { default as InfoCard } from './info_card';导出

这是为了使我可以将一堆“基本”组件导入为：

import {InfoCard, BaseButton, BaseMap} from '@components/base';

问题在于导入方式

import {InfoCard} from '@components/base';

在其他地方工作时，代码的这一部分失败。另外，切换到以下作品

import InfoCard from '@components/base/info_card'

有人可以告诉我为什么会发生这种情况吗...我不太了解webpack中导入的工作方式。

PS ：@components/*是我用于ROOT_DIR/src/components的Webpack别名。