Создание веб-пакетов с помощью ~ / components / ui / index.js и Vue.js

Question

Здравствуйте, у меня есть индекс в модуле пользовательского интерфейса в моих компонентах, который экспортирует все компоненты в этой папке следующим образом:

~/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')
  }
}

В идеале, компонент «Нижний колонтитул» должен быть разбит на другой фрагмент и загружаться только при необходимости.Это работает, если я удаляю его из экспорта ~/components/ui/index.js, например так:

~/components/ui/index.js:

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

export { Button, /*Footer*/ }

Теперь это работает.Но я хотел бы сохранить это в индексе.И используйте webpack treehaking, чтобы исключить Footer из комплекта по умолчанию.

Как мне этого добиться?