fix: Page switching display is abnormal

pull/48/MERGE
vben 2024-06-23 19:55:55 +08:00
parent 16ed5a05ba
commit 89586ef2c4
5 changed files with 10 additions and 32 deletions

View File

@ -20,6 +20,7 @@ RUN echo "Builder Success 🎉"
FROM nginx:stable-alpine as production FROM nginx:stable-alpine as production
RUN echo "types { application/javascript js mjs; }" > /etc/nginx/conf.d/mjs.conf
COPY --from=builder /app/apps/antd-view/dist /usr/share/nginx/html COPY --from=builder /app/apps/antd-view/dist /usr/share/nginx/html
COPY ./deploy/nginx.conf /etc/nginx/nginx.conf COPY ./deploy/nginx.conf /etc/nginx/nginx.conf

View File

@ -1,6 +1,5 @@
import type { import type {
NormalizedOutputOptions, NormalizedOutputOptions,
OutputAsset,
OutputBundle, OutputBundle,
OutputChunk, OutputChunk,
} from 'rollup'; } from 'rollup';
@ -45,25 +44,14 @@ async function viteLicensePlugin(
`.trim(); `.trim();
for (const [, fileContent] of Object.entries(bundle)) { for (const [, fileContent] of Object.entries(bundle)) {
if ( if (fileContent.type === 'chunk' && fileContent.isEntry) {
fileContent.type === 'asset' ||
(fileContent.type === 'chunk' && fileContent.isEntry)
) {
const chunkContent = fileContent as OutputChunk; const chunkContent = fileContent as OutputChunk;
const assetContent = fileContent as OutputAsset;
// 插入版权信息 // 插入版权信息
const content = const content = chunkContent.code;
typeof assetContent.source === 'string'
? assetContent.source
: chunkContent.code;
const updatedContent = `${copyrightText}${EOL}${content}`; const updatedContent = `${copyrightText}${EOL}${content}`;
// 更新bundle // 更新bundle
if (assetContent.source === undefined) { (fileContent as OutputChunk).code = updatedContent;
(fileContent as OutputChunk).code = updatedContent;
} else {
(fileContent as OutputAsset).source = updatedContent;
}
} }
} }
}, },

View File

@ -12,7 +12,7 @@ defineOptions({ name: 'LayoutContent' });
const { keepAlive } = usePreferences(); const { keepAlive } = usePreferences();
const tabsStore = useTabsStore(); const tabsStore = useTabsStore();
const { onTransitionEnd, spinning } = useContentSpinner(); const { spinning } = useContentSpinner();
const { getCacheTabs, getExcludeTabs, renderRouteView } = const { getCacheTabs, getExcludeTabs, renderRouteView } =
storeToRefs(tabsStore); storeToRefs(tabsStore);
@ -51,12 +51,7 @@ function getTransitionName(route: RouteLocationNormalizedLoaded) {
/> />
<IFrameRouterView /> <IFrameRouterView />
<RouterView v-slot="{ Component, route }"> <RouterView v-slot="{ Component, route }">
<Transition <Transition :name="getTransitionName(route)" appear mode="out-in">
:name="getTransitionName(route)"
appear
mode="out-in"
@transitionend="onTransitionEnd"
>
<KeepAlive <KeepAlive
v-if="keepAlive" v-if="keepAlive"
:exclude="getExcludeTabs" :exclude="getExcludeTabs"

View File

@ -5,7 +5,6 @@ import { preferences } from '@vben-core/preferences';
function useContentSpinner() { function useContentSpinner() {
const spinning = ref(false); const spinning = ref(false);
const isStartTransition = ref(false);
const startTime = ref(0); const startTime = ref(0);
const router = useRouter(); const router = useRouter();
const minShowTime = 500; const minShowTime = 500;
@ -29,7 +28,6 @@ function useContentSpinner() {
if (to.meta.loaded || !enableLoading.value) { if (to.meta.loaded || !enableLoading.value) {
return true; return true;
} }
isStartTransition.value = false;
startTime.value = performance.now(); startTime.value = performance.now();
spinning.value = true; spinning.value = true;
return true; return true;
@ -40,17 +38,13 @@ function useContentSpinner() {
return true; return true;
} }
// 未进入过渡动画 // 关闭加载动画
if (!isStartTransition.value) { onEnd();
// 关闭加载动画
onEnd();
}
isStartTransition.value = false;
return true; return true;
}); });
return { onTransitionEnd: onEnd, spinning }; return { spinning };
} }
export { useContentSpinner }; export { useContentSpinner };

View File

@ -181,7 +181,7 @@ preferences:
name: 动画 name: 动画
loading: 页面切换 Loading loading: 页面切换 Loading
transition: 页面切换动画 transition: 页面切换动画
progress: 页面加载进度条 progress: 页面切换进度条
theme: theme:
name: 主题 name: 主题
builtin: 内置主题 builtin: 内置主题