quasar.config.js

@@ -81,6 +81,12 @@ export default configure(function (/* ctx */) {
                 viteConf.build.modulePreload = {
                     polyfill: false,
                 };
+                
+                viteConf.build.rollupOptions = {
+                    onwarn(warning, warn) {                   
+                        throw new Error(warning.message);
+                    },
+                  };
             },
             // viteVuePluginOptions: {},
 

src/boot/i18n-utils.js

@@ -0,0 +1,21 @@
+import { createI18n } from 'vue-i18n';
+import messages from 'src/i18n';
+import { useState } from 'src/composables/useState';
+
+const user = useState().getUser();
+
+export const i18n = createI18n({
+    locale: user.value.lang || navigator.language || navigator.userLanguage,
+    fallbackLocale: 'en',
+    globalInjection: true,
+    messages,
+    missingWarn: false,
+    fallbackWarn: false,
+    legacy: false,
+});
+
+export default {
+    install(app) {
+        app.use(i18n);
+    }
+};

src/boot/i18n.js

@@ -1,22 +1,8 @@
 import { boot } from 'quasar/wrappers';
-import { createI18n } from 'vue-i18n';
-import messages from 'src/i18n';
-import { useState } from 'src/composables/useState';
-const user = useState().getUser();
-
-const i18n = createI18n({
-    locale: user.value.lang || navigator.language || navigator.userLanguage,
-    fallbackLocale: 'en',
-    globalInjection: true,
-    messages,
-    missingWarn: false,
-    fallbackWarn: false,
-    legacy: false,
-});
+import i18nPlugin from './i18n-utils';
 
 export default boot(({ app }) => {
-    // Set i18n instance on app
-    app.use(i18n);
+    app.use(i18nPlugin);
 });
 
-export { i18n };
+export { i18n } from './i18n-utils';

src/components/ui/VnUserLink.vue

@@ -1,5 +1,9 @@
 <script setup>
-import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
+import { defineAsyncComponent } from 'vue';
+
+const WorkerDescriptorProxy = defineAsyncComponent(() => 
+    import('src/pages/Worker/Card/WorkerDescriptorProxy.vue')
+);
 
 defineProps({
     name: { type: String, default: null },

src/pages/Customer/Card/CustomerDescriptorProxy.vue

@@ -1,6 +1,10 @@
 <script setup>
 import CustomerDescriptor from './CustomerDescriptor.vue';
-import CustomerSummary from './CustomerSummary.vue';
+import { defineAsyncComponent } from 'vue';
+
+const CustomerSummary = defineAsyncComponent(() => 
+    import('./CustomerSummary.vue')
+);
 
 const $props = defineProps({
     id: {

src/pages/Customer/components/CustomerSummaryTable.vue

@@ -14,7 +14,11 @@ import TicketSummary from 'src/pages/Ticket/Card/TicketSummary.vue';
 import InvoiceOutDescriptorProxy from 'pages/InvoiceOut/Card/InvoiceOutDescriptorProxy.vue';
 import RouteDescriptorProxy from 'src/pages/Route/Card/RouteDescriptorProxy.vue';
 import VnTable from 'src/components/VnTable/VnTable.vue';
-import CustomerDescriptorProxy from '../Card/CustomerDescriptorProxy.vue';
+import { defineAsyncComponent } from 'vue';
+
+const CustomerDescriptorProxy = defineAsyncComponent(() => 
+    import('../Card/CustomerDescriptorProxy.vue')
+);
 
 const { t } = useI18n();
 const route = useRoute();

src/pages/Entry/Card/EntryDescriptor.vue

@@ -8,9 +8,12 @@ import { useQuasar } from 'quasar';
 import { usePrintService } from 'composables/usePrintService';
 import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
-import TravelDescriptorProxy from 'src/pages/Travel/Card/TravelDescriptorProxy.vue';
 import axios from 'axios';
+import { defineAsyncComponent } from 'vue';
 
+const TravelDescriptorProxy = defineAsyncComponent(() => 
+    import('src/pages/Travel/Card/TravelDescriptorProxy.vue')
+);
 const quasar = useQuasar();
 const { push } = useRouter();
 const { openReport } = usePrintService();

src/pages/InvoiceOut/Card/InvoiceOutSummary.vue

@@ -7,10 +7,14 @@ import { toCurrency, toDate, toPercentage } from 'src/filters';
 import CardSummary from 'components/ui/CardSummary.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import { getUrl } from 'src/composables/getUrl';
-import TicketDescriptorProxy from 'src/pages/Ticket/Card/TicketDescriptorProxy.vue';
 import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
 import VnTitle from 'src/components/common/VnTitle.vue';
 import InvoiceOutDescriptorMenu from './InvoiceOutDescriptorMenu.vue';
+import { defineAsyncComponent } from 'vue';
+
+const TicketDescriptorProxy = defineAsyncComponent(() => 
+    import('src/pages/Ticket/Card/TicketDescriptorProxy.vue')
+);
 
 onMounted(async () => {
     fetch();

src/pages/Order/Card/OrderDescriptor.vue

@@ -6,9 +6,13 @@ import { toCurrency, toDate } from 'src/filters';
 import { useState } from 'src/composables/useState';
 import VnLv from 'src/components/ui/VnLv.vue';
 import FetchData from 'components/FetchData.vue';
-import OrderCard from './OrderCard.vue';
 import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
 import DepartmentDescriptorProxy from 'src/pages/Worker/Department/Card/DepartmentDescriptorProxy.vue';
+import { defineAsyncComponent } from 'vue';
+
+const OrderCard = defineAsyncComponent(() => 
+    import('./OrderCard.vue')
+);
 
 const DEFAULT_ITEMS = 0;
 

src/pages/Route/Card/RouteDescriptorProxy.vue

@@ -1,6 +1,10 @@
 <script setup>
 import RouteDescriptor from 'pages/Route/Card/RouteDescriptor.vue';
-import RouteSummary from './RouteSummary.vue';
+import { defineAsyncComponent } from 'vue';
+
+const RouteSummary = defineAsyncComponent(() => 
+    import('./RouteSummary.vue')
+);
 
 const $props = defineProps({
     id: {

src/pages/Route/Card/RouteSummary.vue

@@ -7,12 +7,20 @@ import { QIcon } from 'quasar';
 import { dashIfEmpty, toCurrency, toDate, toHour } from 'src/filters';
 import { openBuscaman } from 'src/utils/buscaman';
 import CardSummary from 'components/ui/CardSummary.vue';
-import WorkerDescriptorProxy from 'pages/Worker/Card/WorkerDescriptorProxy.vue';
-import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
-import TicketDescriptorProxy from 'pages/Ticket/Card/TicketDescriptorProxy.vue';
 import VnLv from 'components/ui/VnLv.vue';
 import VnTitle from 'src/components/common/VnTitle.vue';
 import RouteDescriptorMenu from './RouteDescriptorMenu.vue';
+import { defineAsyncComponent } from 'vue';
+
+const WorkerDescriptorProxy = defineAsyncComponent(() => 
+    import('pages/Worker/Card/WorkerDescriptorProxy.vue')
+);
+const CustomerDescriptorProxy = defineAsyncComponent(() => 
+    import('pages/Customer/Card/CustomerDescriptorProxy.vue')
+);
+const TicketDescriptorProxy = defineAsyncComponent(() => 
+    import('pages/Ticket/Card/TicketDescriptorProxy.vue')
+);
 
 const $props = defineProps({
     id: {

src/pages/Ticket/Card/TicketSummary.vue

@@ -1,5 +1,4 @@
 <script setup>
-import RouteDescriptorProxy from 'pages/Route/Card/RouteDescriptorProxy.vue';
 import { onMounted, ref, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
@@ -7,7 +6,6 @@ import axios from 'axios';
 import { dashIfEmpty, toDate, toCurrency } from 'src/filters';
 import CardSummary from 'components/ui/CardSummary.vue';
 import FetchedTags from 'components/ui/FetchedTags.vue';
-import InvoiceOutDescriptorProxy from 'pages/InvoiceOut/Card/InvoiceOutDescriptorProxy.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
 import { getUrl } from 'src/composables/getUrl';
@@ -17,10 +15,18 @@ import VnTitle from 'src/components/common/VnTitle.vue';
 import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
 import DepartmentDescriptorProxy from 'src/pages/Worker/Department/Card/DepartmentDescriptorProxy.vue';
 import ZoneDescriptorProxy from 'src/pages/Zone/Card/ZoneDescriptorProxy.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
 import VnToSummary from 'src/components/ui/VnToSummary.vue';
 import TicketDescriptorMenu from './TicketDescriptorMenu.vue';
 import TicketProblems from 'src/components/TicketProblems.vue';
+import { defineAsyncComponent } from 'vue';
+
+const RouteDescriptorProxy = defineAsyncComponent(() => 
+    import('pages/Route/Card/RouteDescriptorProxy.vue')
+);
+
+const InvoiceOutDescriptorProxy = defineAsyncComponent(() => 
+    import('pages/InvoiceOut/Card/InvoiceOutDescriptorProxy.vue')
+);
 import VnDropdown from 'src/components/common/VnDropdown.vue';
 
 const route = useRoute();

src/pages/Travel/Card/TravelSummary.vue

@@ -6,13 +6,16 @@ import { useI18n } from 'vue-i18n';
 import CardSummary from 'components/ui/CardSummary.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import VnTitle from 'src/components/common/VnTitle.vue';
-import EntryDescriptorProxy from 'src/pages/Entry/Card/EntryDescriptorProxy.vue';
 import { toDate, toCurrency, toCelsius } from 'src/filters';
 import { toDateTimeFormat } from 'src/filters/date.js';
 import { dashIfEmpty } from 'src/filters';
 import axios from 'axios';
 import TravelDescriptorMenuItems from './TravelDescriptorMenuItems.vue';
+import { defineAsyncComponent } from 'vue';
 
+const EntryDescriptorProxy = defineAsyncComponent(() => 
+    import('src/pages/Entry/Card/EntryDescriptorProxy.vue')
+);
 const $props = defineProps({
     id: {
         type: Number,