dynamic imports/exports components in vue.js with .ts files

by

In Vue.js project, i have a file services.ts which contains code

export { default as UserService } from "@/views/user/services/UserService";
export { default as LoginHistoryService } from "@/views/user/services/LoginHistoryService";
export { default as PermissionGroupService } from "@/views/permission-group/services/PermissionGroupService";
export { default as PermissionService } from "@/views/permission/services/PermissionService";
export { default as ManufacturerService } from "@/views/manufacturer/services/ManufacturerService";
export { default as AdminGroupService } from "@/views/admin-group/services/AdminGroupService";

When i write

import { ManufacturerService } from "@/api/imports/services";

in some other file, i want to load just ManufacturerService, but when i check Network tab on inspect page, i can see that other services are also loaded, which can slow down my app. How can i import just ManufacturerService, without others?

with .vue files, there is dynamic export with

import { defineAsyncComponent } from "vue";

, but i need it for .ts files also where ManufacturerService is class in typescript.

Thanks in advance,

Nikola

i really couldnt find any solution

Leave a Comment