Основы компонентов - Разработка библиотеки компонентов - Глобальное подключение компонентов

Библиотечные компоненты мы можем сделать глобальными. Тогда при использовании их не нужно будет импортировать. Для этого в папке ui создадим файл index.js со следующим содержимым:

import MyDialog from "@/components/ui/elements/MyDialog";
import FormInput from "@/components/ui/forms/FormInput";
import FormSelect from "@/components/ui/forms/FormSelect";
import FormButton from "@/components/ui/forms/FormButton";

export default [
    MyDialog,
    FormInput,
    FormSelect,
    FormButton
];

Т.е. в этом файле подключим все библиотечные компоненты.

Далее немного перепишем файл корневой файл main.js

...
import components from '@/components/ui';
...
const app = createApp(App);
components.forEach(component => {
    app.component(component.name, component);
})
app.use(router).mount('#app');

В этом файле мы подключим index.js из нашей библиотеки. Потом создадим объект app - объект приложения. И с помощью цикла forEach пройдёмся по всем библиотечным компонентам, добавляя их к приложению.