1) глобальные компоненты (<a-calendar></a-calendar>
# main.ts
import Antd from "ant-design-vue/lib";
import "ant-design-vue/dist/antd.css";
app.use(Antd);
2) локальные компоненты (убираем верхние строчки из main.ts и пишем внутри компонента <Calendar />):
# src/components/MyComponent.vue
import { Calendar } from "ant-design-vue/lib";
какой путь лучше? я считаю, что второй, так как:
1) профайлер показывает, что рендеринг происходит быстрее
2) можно видеть типы в компоненте, потому что html тэг дает 0 информации, только название компонента, которое надо искать в node_modules, документации
однако, в юнит тестах такой путь может быть болезненный, так как вместо setup файла с Vue.use(Antd) пробрасываем ручками компоненты:
const wrapper = mount(App, {
global: {
plugins: [router],
components: {
Calendar,
},
},
});
явные импорты всегда лучше глобального чего-бы-ни-было
а второй минус исправился посредством добавления babel-import-plugin. теперь в юнит тестах не надо прокидывать компоненты
Обсуждают сегодня