使用〜/ components / ui / index.js和Vue.js进行Webpack摇树

Question

您好，我的组件中的UI模块中有一个索引，该文件夹中的所有组件都像这样导出：

~/components/ui/index.js：

import Button from './Button';
import Footer from './Footer';

export { Button, Footer }

我在某些页面中使用它，如下所示：

import { Button } from '~/components/ui';

export default {
  components: {
     Button,
     Footer: () => import('~/components/ui/Footer')
  }
}

现在，理想情况下，应将Footer组件拆分为不同的块，并且仅在需要时才加载。如果我将其从~/components/ui/index.js的导出中删除，这将起作用，就像这样：

~/components/ui/index.js：

import Button from './Button';
//import Footer from './Footer'; 

export { Button, /*Footer*/ }

现在这可行。但我想将其保留在索引中。并使用webpack摇树将默认捆绑中的Footer删除。

我该如何实现？