diff --git a/src/layouts/index.vue b/src/layouts/index.vue index 54ecd58..e3f0e29 100755 --- a/src/layouts/index.vue +++ b/src/layouts/index.vue @@ -111,7 +111,7 @@ const enableAppSetting = import.meta.env.VITE_APP_SETTING === 'true'
- + diff --git a/src/router/index.ts b/src/router/index.ts index b192ffa..e9533c5 100755 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -1,4 +1,5 @@ import { createRouter, createWebHashHistory } from 'vue-router' +import { loadingFadeOut } from 'virtual:app-loading' import setupGuards from './guards' // 路由相关数据 @@ -13,4 +14,8 @@ const router = createRouter({ setupGuards(router) +router.isReady().then(() => { + loadingFadeOut() +}) + export default router diff --git a/src/types/shims.d.ts b/src/types/shims.d.ts index fdabb3e..41c5a0a 100755 --- a/src/types/shims.d.ts +++ b/src/types/shims.d.ts @@ -3,6 +3,13 @@ declare interface Window { mozDevicePixelRatio: any } +declare module 'virtual:app-loading' { + const loadingFadeOut: () => void + export { + loadingFadeOut, + } +} + declare const __SYSTEM_INFO__: { pkg: { version: Recordable diff --git a/vite/plugins.ts b/vite/plugins.ts index 48f3f06..0623025 100644 --- a/vite/plugins.ts +++ b/vite/plugins.ts @@ -124,34 +124,44 @@ export default function createVitePlugins(viteEnv, isBuild = false) { } })(), - { - name: 'vite-plugin-loading', - enforce: 'pre', - transformIndexHtml: { - handler: async html => html.replace(/<\/body>/, `${ - `
${await fs.readFileSync(path.resolve(process.cwd(), 'loading.html'), 'utf8')}
` - }`), - order: 'pre', - }, - transform: (code, id) => { - if (/src\/main.ts$/.test(id)) { - code = code.concat(` - const loadingEl = document.querySelector('[data-app-loading]') - if (loadingEl) { - loadingEl.style['pointer-events'] = 'none' - loadingEl.style.visibility = 'hidden' - loadingEl.style.opacity = 0 - loadingEl.style.transition = 'all 0.5s ease-out' - loadingEl.addEventListener('transitionend', () => loadingEl.remove(), { once: true }) - } - `) - return { - code, - map: null, + (function () { + const virtualModuleId = 'virtual:app-loading' + const resolvedVirtualModuleId = `\0${virtualModuleId}` + return { + name: 'vite-plugin-loading', + resolveId(id) { + if (id === virtualModuleId) { + return resolvedVirtualModuleId } - } - }, - }, + }, + load(id) { + if (id === resolvedVirtualModuleId) { + return { + code: ` + export function loadingFadeOut() { + const loadingEl = document.querySelector('[data-app-loading]') + if (loadingEl) { + loadingEl.style['pointer-events'] = 'none' + loadingEl.style.visibility = 'hidden' + loadingEl.style.opacity = 0 + loadingEl.style.transition = 'all 0.5s ease-out' + loadingEl.addEventListener('transitionend', () => loadingEl.remove(), { once: true }) + } + } + `, + map: null, + } + } + }, + enforce: 'pre', + transformIndexHtml: { + handler: async html => html.replace(/<\/body>/, `${ + `
${await fs.readFileSync(path.resolve(process.cwd(), 'loading.html'), 'utf8')}
` + }`), + order: 'pre', + }, + } + })(), // https://github.com/unplugin/unplugin-turbo-console TurboConsole(),