mirror of
https://github.com/MHSanaei/3x-ui.git
synced 2026-07-26 06:16:12 +00:00
fix: split locale chunks by removing eager i18n glob
The eager `import.meta.glob` was statically pulling all 13 locale JSON files into the main bundle, defeating the sibling lazy glob and emitting INEFFECTIVE_DYNAMIC_IMPORT warnings. Statically import only the en-US fallback, lazy-load the rest, and await `readyI18n()` in each entry before mount so the first paint still uses the active locale.
This commit is contained in:
@@ -4,7 +4,7 @@ import 'ant-design-vue/dist/reset.css';
|
||||
|
||||
import { setupAxios } from '@/api/axios-init.js';
|
||||
import '@/composables/useTheme.js';
|
||||
import { i18n } from '@/i18n/index.js';
|
||||
import { i18n, readyI18n } from '@/i18n/index.js';
|
||||
import { applyDocumentTitle } from '@/utils';
|
||||
import ApiDocsPage from '@/pages/api-docs/ApiDocsPage.vue';
|
||||
|
||||
@@ -16,4 +16,6 @@ if (messageContainer) {
|
||||
message.config({ getContainer: () => messageContainer });
|
||||
}
|
||||
|
||||
createApp(ApiDocsPage).use(Antd).use(i18n).mount('#app');
|
||||
readyI18n().then(() => {
|
||||
createApp(ApiDocsPage).use(Antd).use(i18n).mount('#app');
|
||||
});
|
||||
|
||||
@@ -4,7 +4,7 @@ import 'ant-design-vue/dist/reset.css';
|
||||
|
||||
import { setupAxios } from '@/api/axios-init.js';
|
||||
import '@/composables/useTheme.js';
|
||||
import { i18n } from '@/i18n/index.js';
|
||||
import { i18n, readyI18n } from '@/i18n/index.js';
|
||||
import { applyDocumentTitle } from '@/utils';
|
||||
import InboundsPage from '@/pages/inbounds/InboundsPage.vue';
|
||||
|
||||
@@ -16,4 +16,6 @@ if (messageContainer) {
|
||||
message.config({ getContainer: () => messageContainer });
|
||||
}
|
||||
|
||||
createApp(InboundsPage).use(Antd).use(i18n).mount('#app');
|
||||
readyI18n().then(() => {
|
||||
createApp(InboundsPage).use(Antd).use(i18n).mount('#app');
|
||||
});
|
||||
|
||||
@@ -6,7 +6,7 @@ import { setupAxios } from '@/api/axios-init.js';
|
||||
// Importing useTheme triggers the boot side-effect that applies the
|
||||
// stored theme to <body>/<html> before Vue mounts.
|
||||
import '@/composables/useTheme.js';
|
||||
import { i18n } from '@/i18n/index.js';
|
||||
import { i18n, readyI18n } from '@/i18n/index.js';
|
||||
import { applyDocumentTitle } from '@/utils';
|
||||
import IndexPage from '@/pages/index/IndexPage.vue';
|
||||
|
||||
@@ -18,4 +18,6 @@ if (messageContainer) {
|
||||
message.config({ getContainer: () => messageContainer });
|
||||
}
|
||||
|
||||
createApp(IndexPage).use(Antd).use(i18n).mount('#app');
|
||||
readyI18n().then(() => {
|
||||
createApp(IndexPage).use(Antd).use(i18n).mount('#app');
|
||||
});
|
||||
|
||||
@@ -6,18 +6,18 @@ import { setupAxios } from '@/api/axios-init.js';
|
||||
// Importing this module triggers the boot side-effect that applies the
|
||||
// stored theme to <body>/<html> before Vue renders anything.
|
||||
import '@/composables/useTheme.js';
|
||||
import { i18n } from '@/i18n/index.js';
|
||||
import { i18n, readyI18n } from '@/i18n/index.js';
|
||||
import { applyDocumentTitle } from '@/utils';
|
||||
import LoginPage from '@/pages/login/LoginPage.vue';
|
||||
|
||||
setupAxios();
|
||||
applyDocumentTitle();
|
||||
|
||||
// Toasts attach to a #message div the page provides — keeps theme
|
||||
// styling in sync with the rest of the panel.
|
||||
const messageContainer = document.getElementById('message');
|
||||
if (messageContainer) {
|
||||
message.config({ getContainer: () => messageContainer });
|
||||
}
|
||||
|
||||
createApp(LoginPage).use(Antd).use(i18n).mount('#app');
|
||||
readyI18n().then(() => {
|
||||
createApp(LoginPage).use(Antd).use(i18n).mount('#app');
|
||||
});
|
||||
|
||||
@@ -4,7 +4,7 @@ import 'ant-design-vue/dist/reset.css';
|
||||
|
||||
import { setupAxios } from '@/api/axios-init.js';
|
||||
import '@/composables/useTheme.js';
|
||||
import { i18n } from '@/i18n/index.js';
|
||||
import { i18n, readyI18n } from '@/i18n/index.js';
|
||||
import { applyDocumentTitle } from '@/utils';
|
||||
import NodesPage from '@/pages/nodes/NodesPage.vue';
|
||||
|
||||
@@ -16,4 +16,6 @@ if (messageContainer) {
|
||||
message.config({ getContainer: () => messageContainer });
|
||||
}
|
||||
|
||||
createApp(NodesPage).use(Antd).use(i18n).mount('#app');
|
||||
readyI18n().then(() => {
|
||||
createApp(NodesPage).use(Antd).use(i18n).mount('#app');
|
||||
});
|
||||
|
||||
@@ -6,7 +6,7 @@ import { setupAxios } from '@/api/axios-init.js';
|
||||
// Importing useTheme triggers the boot side-effect that applies the
|
||||
// stored theme to <body>/<html> before Vue mounts.
|
||||
import '@/composables/useTheme.js';
|
||||
import { i18n } from '@/i18n/index.js';
|
||||
import { i18n, readyI18n } from '@/i18n/index.js';
|
||||
import { applyDocumentTitle } from '@/utils';
|
||||
import SettingsPage from '@/pages/settings/SettingsPage.vue';
|
||||
|
||||
@@ -18,4 +18,6 @@ if (messageContainer) {
|
||||
message.config({ getContainer: () => messageContainer });
|
||||
}
|
||||
|
||||
createApp(SettingsPage).use(Antd).use(i18n).mount('#app');
|
||||
readyI18n().then(() => {
|
||||
createApp(SettingsPage).use(Antd).use(i18n).mount('#app');
|
||||
});
|
||||
|
||||
@@ -7,7 +7,7 @@ import 'ant-design-vue/dist/reset.css';
|
||||
// with the parsed traffic/quota/expiry view-model and the rendered
|
||||
// share links — the SPA reads those at mount.
|
||||
import '@/composables/useTheme.js';
|
||||
import { i18n } from '@/i18n/index.js';
|
||||
import { i18n, readyI18n } from '@/i18n/index.js';
|
||||
import SubPage from '@/pages/sub/SubPage.vue';
|
||||
|
||||
const messageContainer = document.getElementById('message');
|
||||
@@ -15,4 +15,6 @@ if (messageContainer) {
|
||||
message.config({ getContainer: () => messageContainer });
|
||||
}
|
||||
|
||||
createApp(SubPage).use(Antd).use(i18n).mount('#app');
|
||||
readyI18n().then(() => {
|
||||
createApp(SubPage).use(Antd).use(i18n).mount('#app');
|
||||
});
|
||||
|
||||
@@ -4,7 +4,7 @@ import 'ant-design-vue/dist/reset.css';
|
||||
|
||||
import { setupAxios } from '@/api/axios-init.js';
|
||||
import '@/composables/useTheme.js';
|
||||
import { i18n } from '@/i18n/index.js';
|
||||
import { i18n, readyI18n } from '@/i18n/index.js';
|
||||
import { applyDocumentTitle } from '@/utils';
|
||||
import XrayPage from '@/pages/xray/XrayPage.vue';
|
||||
|
||||
@@ -16,4 +16,6 @@ if (messageContainer) {
|
||||
message.config({ getContainer: () => messageContainer });
|
||||
}
|
||||
|
||||
createApp(XrayPage).use(Antd).use(i18n).mount('#app');
|
||||
readyI18n().then(() => {
|
||||
createApp(XrayPage).use(Antd).use(i18n).mount('#app');
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user