修正一个导入方式

This commit is contained in:
321zhangjvzhi 2024-04-02 14:29:42 +08:00
parent 6f6cb1977d
commit 8dfbd9b338
3 changed files with 194 additions and 115 deletions

23
src/boot.ts Normal file
View File

@ -0,0 +1,23 @@
//@ts-ignore
import css from '@/styles/init.css?url'
//@ts-ignore
import logo from '@/icons/common/sidebar-logo.svg?url'
import settings from '@/settings'
document.querySelector('#app')!.innerHTML = `
<div class="__init__">
<link id="__init__" rel="stylesheet" href="${css}" />
<div class="__init__image">
<img src="${logo}" alt="" />
</div>
<div class="__init__title">${settings.title}</div>
<div class="__init__process-frame">
<div class="__init__progress">
<div class="__init__masker"></div>
</div>
</div>
</div>
`
;(async () => {
await import('./main')
})()

68
src/styles/init.css Normal file
View File

@ -0,0 +1,68 @@
.__init__ {
position: absolute;
left: 0;
top: 0;
height: 100vh;
width: 100vw;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.__init__title {
font-size: 2.5vmin;
padding: 1.5vmin;
font-weight: bold;
font-family: 'system-ui';
}
.__init__image {
height: 20vmin;
width: 20vmin;
/*background-image: url("/public/loading-logo.svg");*/
background-size: 100% 100%;
margin-bottom: 4vmin;
overflow: hidden;
transform: translateY(-1000px);
filter: drop-shadow(0px 1000px orange);
}
.__init__image img {
height: 100%;
width: 100%;
}
.__init__process-frame {
width: 33%;
height: 2.4vmin;
border-radius: 1.2vmin;
overflow: hidden;
}
.__init__progress {
width: 100%;
height: 100%;
background: linear-gradient(-45deg, #0278ee 36%, #7db9e8 28%, #7db9e8 67%, #0278ee 25%);
background-size: 4em 2em;
-webkit-animation: load 1s;
animation: __init__load 1s;
position: relative;
}
.__init__masker {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
opacity: 0.8;
background: linear-gradient(90deg, #1c7bda 20%, #fff 100%)
}
@keyframes __init__load {
0% {
width: 0;
}
}

View File

@ -5,125 +5,113 @@
// Generated by unplugin-auto-import // Generated by unplugin-auto-import
export {} export {}
declare global { declare global {
const EffectScope: (typeof import('vue'))['EffectScope'] const EffectScope: typeof import('vue')['EffectScope']
const buttonCodes: (typeof import('../src/directives/button-codes'))['default'] const buttonCodes: typeof import('../src/directives/button-codes')['default']
const casHandleChange: (typeof import('../src/hooks/use-element'))['casHandleChange'] const casHandleChange: typeof import('../src/hooks/use-element')['casHandleChange']
const clickoutside: (typeof import('../src/directives/example/clickoutside.js'))['default'] const clickoutside: typeof import('../src/directives/example/clickoutside.js')['default']
const cloneDeep: (typeof import('../src/hooks/use-common'))['cloneDeep'] const cloneDeep: typeof import('../src/hooks/use-common')['cloneDeep']
const closeElLoading: (typeof import('../src/hooks/use-element'))['closeElLoading'] const closeElLoading: typeof import('../src/hooks/use-element')['closeElLoading']
const codesPermission: (typeof import('../src/directives/codes-permission'))['default'] const codesPermission: typeof import('../src/directives/codes-permission')['default']
const computed: (typeof import('vue'))['computed'] const computed: typeof import('vue')['computed']
const copy: (typeof import('../src/directives/example/copy.js'))['default'] const copy: typeof import('../src/directives/example/copy.js')['default']
const copyValueToClipboard: (typeof import('../src/hooks/use-common'))['copyValueToClipboard'] const copyValueToClipboard: typeof import('../src/hooks/use-common')['copyValueToClipboard']
const createApp: (typeof import('vue'))['createApp'] const createApp: typeof import('vue')['createApp']
const customRef: (typeof import('vue'))['customRef'] const customRef: typeof import('vue')['customRef']
const debounce: (typeof import('../src/directives/example/debounce.js'))['default'] const debounce: typeof import('../src/directives/example/debounce.js')['default']
const defineAsyncComponent: (typeof import('vue'))['defineAsyncComponent'] const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
const defineComponent: (typeof import('vue'))['defineComponent'] const defineComponent: typeof import('vue')['defineComponent']
const directives: (typeof import('../src/directives/index'))['default'] const directives: typeof import('../src/directives/index')['default']
const effectScope: (typeof import('vue'))['effectScope'] const effectScope: typeof import('vue')['effectScope']
const elConfirm: (typeof import('../src/hooks/use-element'))['elConfirm'] const elConfirm: typeof import('../src/hooks/use-element')['elConfirm']
const elConfirmNoCancelBtn: (typeof import('../src/hooks/use-element'))['elConfirmNoCancelBtn'] const elConfirmNoCancelBtn: typeof import('../src/hooks/use-element')['elConfirmNoCancelBtn']
const elLoading: (typeof import('../src/hooks/use-element'))['elLoading'] const elLoading: typeof import('../src/hooks/use-element')['elLoading']
const elMessage: (typeof import('../src/hooks/use-element'))['elMessage'] const elMessage: typeof import('../src/hooks/use-element')['elMessage']
const elNotify: (typeof import('../src/hooks/use-element'))['elNotify'] const elNotify: typeof import('../src/hooks/use-element')['elNotify']
const freshRouter: (typeof import('../src/hooks/use-permission'))['freshRouter'] const freshRouter: typeof import('../src/hooks/use-permission')['freshRouter']
const getCurrentInstance: (typeof import('vue'))['getCurrentInstance'] const getCurrentInstance: typeof import('vue')['getCurrentInstance']
const getCurrentScope: (typeof import('vue'))['getCurrentScope'] const getCurrentScope: typeof import('vue')['getCurrentScope']
const getLangInstance: (typeof import('../src/hooks/use-common'))['getLangInstance'] const getLangInstance: typeof import('../src/hooks/use-common')['getLangInstance']
const getQueryParam: (typeof import('../src/hooks/use-self-router'))['getQueryParam'] const getQueryParam: typeof import('../src/hooks/use-self-router')['getQueryParam']
const h: (typeof import('vue'))['h'] const h: typeof import('vue')['h']
const inject: (typeof import('vue'))['inject'] const inject: typeof import('vue')['inject']
const isExternal: (typeof import('../src/hooks/use-layout'))['isExternal'] const isExternal: typeof import('../src/hooks/use-layout')['isExternal']
const isProxy: (typeof import('vue'))['isProxy'] const isProxy: typeof import('vue')['isProxy']
const isReactive: (typeof import('vue'))['isReactive'] const isReactive: typeof import('vue')['isReactive']
const isReadonly: (typeof import('vue'))['isReadonly'] const isReadonly: typeof import('vue')['isReadonly']
const isRef: (typeof import('vue'))['isRef'] const isRef: typeof import('vue')['isRef']
const lang: (typeof import('../src/directives/lang'))['default'] const lang: typeof import('../src/directives/lang')['default']
const langTitle: (typeof import('../src/hooks/use-common'))['langTitle'] const langTitle: typeof import('../src/hooks/use-common')['langTitle']
const longpress: (typeof import('../src/directives/example/longpress.js'))['default'] const longpress: typeof import('../src/directives/example/longpress.js')['default']
const markRaw: (typeof import('vue'))['markRaw'] const markRaw: typeof import('vue')['markRaw']
const nextTick: (typeof import('vue'))['nextTick'] const nextTick: typeof import('vue')['nextTick']
const onActivated: (typeof import('vue'))['onActivated'] const onActivated: typeof import('vue')['onActivated']
const onBeforeMount: (typeof import('vue'))['onBeforeMount'] const onBeforeMount: typeof import('vue')['onBeforeMount']
const onBeforeRouteLeave: (typeof import('vue-router'))['onBeforeRouteLeave'] const onBeforeRouteLeave: typeof import('vue-router')['onBeforeRouteLeave']
const onBeforeRouteUpdate: (typeof import('vue-router'))['onBeforeRouteUpdate'] const onBeforeRouteUpdate: typeof import('vue-router')['onBeforeRouteUpdate']
const onBeforeUnmount: (typeof import('vue'))['onBeforeUnmount'] const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
const onBeforeUpdate: (typeof import('vue'))['onBeforeUpdate'] const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
const onDeactivated: (typeof import('vue'))['onDeactivated'] const onDeactivated: typeof import('vue')['onDeactivated']
const onErrorCaptured: (typeof import('vue'))['onErrorCaptured'] const onErrorCaptured: typeof import('vue')['onErrorCaptured']
const onMounted: (typeof import('vue'))['onMounted'] const onMounted: typeof import('vue')['onMounted']
const onRenderTracked: (typeof import('vue'))['onRenderTracked'] const onRenderTracked: typeof import('vue')['onRenderTracked']
const onRenderTriggered: (typeof import('vue'))['onRenderTriggered'] const onRenderTriggered: typeof import('vue')['onRenderTriggered']
const onScopeDispose: (typeof import('vue'))['onScopeDispose'] const onScopeDispose: typeof import('vue')['onScopeDispose']
const onServerPrefetch: (typeof import('vue'))['onServerPrefetch'] const onServerPrefetch: typeof import('vue')['onServerPrefetch']
const onUnmounted: (typeof import('vue'))['onUnmounted'] const onUnmounted: typeof import('vue')['onUnmounted']
const onUpdated: (typeof import('vue'))['onUpdated'] const onUpdated: typeof import('vue')['onUpdated']
const progressClose: (typeof import('../src/hooks/use-permission'))['progressClose'] const progressClose: typeof import('../src/hooks/use-permission')['progressClose']
const progressStart: (typeof import('../src/hooks/use-permission'))['progressStart'] const progressStart: typeof import('../src/hooks/use-permission')['progressStart']
const provide: (typeof import('vue'))['provide'] const provide: typeof import('vue')['provide']
const reactive: (typeof import('vue'))['reactive'] const reactive: typeof import('vue')['reactive']
const readonly: (typeof import('vue'))['readonly'] const readonly: typeof import('vue')['readonly']
const ref: (typeof import('vue'))['ref'] const ref: typeof import('vue')['ref']
const resetRouter: (typeof import('../src/hooks/use-permission'))['resetRouter'] const resetRouter: typeof import('../src/hooks/use-permission')['resetRouter']
const resetState: (typeof import('../src/hooks/use-permission'))['resetState'] const resetState: typeof import('../src/hooks/use-permission')['resetState']
const resizeHandler: (typeof import('../src/hooks/use-layout'))['resizeHandler'] const resizeHandler: typeof import('../src/hooks/use-layout')['resizeHandler']
const resolveComponent: (typeof import('vue'))['resolveComponent'] const resolveComponent: typeof import('vue')['resolveComponent']
const resolveDirective: (typeof import('vue'))['resolveDirective'] const resolveDirective: (typeof import('vue'))['resolveDirective']
const rolesPermission: (typeof import('../src/directives/roles-permission'))['default'] const rolesPermission: typeof import('../src/directives/roles-permission')['default']
const routeInfo: (typeof import('../src/hooks/use-self-router'))['routeInfo'] const routeInfo: typeof import('../src/hooks/use-self-router')['routeInfo']
const routerBack: (typeof import('../src/hooks/use-self-router'))['routerBack'] const routerBack: typeof import('../src/hooks/use-self-router')['routerBack']
const routerPush: (typeof import('../src/hooks/use-self-router'))['routerPush'] const routerPush: typeof import('../src/hooks/use-self-router')['routerPush']
const routerReplace: (typeof import('../src/hooks/use-self-router'))['routerReplace'] const routerReplace: typeof import('../src/hooks/use-self-router')['routerReplace']
const setRouterFromDatabase: (typeof import('../src/hooks/use-permission'))['setRouterFromDatabase'] const setRouterFromDatabase: typeof import('../src/hooks/use-permission')['setRouterFromDatabase']
const shallowReactive: (typeof import('vue'))['shallowReactive'] const shallowReactive: typeof import('vue')['shallowReactive']
const shallowReadonly: (typeof import('vue'))['shallowReadonly'] const shallowReadonly: typeof import('vue')['shallowReadonly']
const shallowRef: (typeof import('vue'))['shallowRef'] const shallowRef: typeof import('vue')['shallowRef']
const sleepTimeout: (typeof import('../src/hooks/use-common'))['sleepTimeout'] const sleepTimeout: typeof import('../src/hooks/use-common')['sleepTimeout']
const storeToRefs: (typeof import('pinia/dist/pinia'))['storeToRefs'] const storeToRefs: typeof import('pinia/dist/pinia')['storeToRefs']
const toRaw: (typeof import('vue'))['toRaw'] const toRaw: typeof import('vue')['toRaw']
const toRef: (typeof import('vue'))['toRef'] const toRef: typeof import('vue')['toRef']
const toRefs: (typeof import('vue'))['toRefs'] const toRefs: typeof import('vue')['toRefs']
const toValue: (typeof import('vue'))['toValue'] const toValue: typeof import('vue')['toValue']
const triggerRef: (typeof import('vue'))['triggerRef'] const triggerRef: typeof import('vue')['triggerRef']
const unref: (typeof import('vue'))['unref'] const unref: typeof import('vue')['unref']
const useAttrs: (typeof import('vue'))['useAttrs'] const useAttrs: typeof import('vue')['useAttrs']
const useBasicStore: (typeof import('../src/store/basic'))['useBasicStore'] const useBasicStore: typeof import('../src/store/basic')['useBasicStore']
const useConfigStore: (typeof import('../src/store/config'))['useConfigStore'] const useConfigStore: typeof import('../src/store/config')['useConfigStore']
const useCssModule: (typeof import('vue'))['useCssModule'] const useCssModule: typeof import('vue')['useCssModule']
const useCssVars: (typeof import('vue'))['useCssVars'] const useCssVars: typeof import('vue')['useCssVars']
const useDebuggerStore: (typeof import('../src/store/debuger'))['useDebuggerStore'] const useDebuggerStore: typeof import('../src/store/debuger')['useDebuggerStore']
const useElement: (typeof import('../src/hooks/use-element'))['useElement'] const useElement: typeof import('../src/hooks/use-element')['useElement']
const useLink: (typeof import('vue-router'))['useLink'] const useLink: typeof import('vue-router')['useLink']
const useRoute: (typeof import('vue-router'))['useRoute'] const useRoute: typeof import('vue-router')['useRoute']
const useRouter: (typeof import('vue-router'))['useRouter'] const useRouter: typeof import('vue-router')['useRouter']
const useSlots: (typeof import('vue'))['useSlots'] const useSlots: typeof import('vue')['useSlots']
const useSystemStore: (typeof import('../src/store/system'))['useSystemStore'] const useSystemStore: typeof import('../src/store/system')['useSystemStore']
const useTable: (typeof import('../src/hooks/use-table'))['useTable'] const useTable: typeof import('../src/hooks/use-table')['useTable']
const useTagsViewStore: (typeof import('../src/store/tags-view'))['useTagsViewStore'] const useTagsViewStore: typeof import('../src/store/tags-view')['useTagsViewStore']
const userRouteStore: (typeof import('../src/store/routes'))['userRouteStore'] const userRouteStore: typeof import('../src/store/routes')['userRouteStore']
const watch: (typeof import('vue'))['watch'] const watch: typeof import('vue')['watch']
const watchEffect: (typeof import('vue'))['watchEffect'] const watchEffect: typeof import('vue')['watchEffect']
const watchPostEffect: (typeof import('vue'))['watchPostEffect'] const watchPostEffect: typeof import('vue')['watchPostEffect']
const watchSyncEffect: (typeof import('vue'))['watchSyncEffect'] const watchSyncEffect: typeof import('vue')['watchSyncEffect']
const watermark: (typeof import('../src/directives/example/watermark.js'))['default'] const watermark: typeof import('../src/directives/example/watermark.js')['default']
const waves: (typeof import('../src/directives/example/waves.js'))['default'] const waves: typeof import('../src/directives/example/waves.js')['default']
} }
// for type re-export // for type re-export
declare global { declare global {
// @ts-ignore // @ts-ignore
export type { export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
Component,
ComponentPublicInstance,
ComputedRef,
ExtractDefaultPropTypes,
ExtractPropTypes,
ExtractPublicPropTypes,
InjectionKey,
PropType,
Ref,
VNode,
WritableComputedRef
} from 'vue'
import('vue') import('vue')
} }