mirror of
https://github.com/CorentinTh/it-tools.git
synced 2025-05-05 13:57:10 -04:00
🐛 Fix Hydration problem.
This commit is contained in:
parent
cb44d3db8b
commit
4892b575bd
7 changed files with 53 additions and 28 deletions
|
@ -48,6 +48,8 @@
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"><!--app-html--></div>
|
<div id="app"><!--app-html--></div>
|
||||||
<script type="module" src="/src/main.ts"></script>
|
<!-- <script type="module" src="/src/main.ts"></script>-->
|
||||||
|
<script type="module" src="/src/entry-client.ts"></script>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
/* TEAM */
|
/* TEAM */
|
||||||
Developer: Corentin Thomasset
|
Developer: Ne0
|
||||||
Site: https://github.com/CorentinTh
|
Site: https://github.com/zeeklog
|
||||||
Twitter: @cthmsst
|
Twitter: @neo2028
|
||||||
|
|
|
@ -18,6 +18,10 @@ syncRef(
|
||||||
locale,
|
locale,
|
||||||
useStorage('locale', locale),
|
useStorage('locale', locale),
|
||||||
);
|
);
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
console.log('APP MOUNTED');
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
|
@ -30,5 +30,9 @@ app.use(plausible);
|
||||||
app.use(naive);
|
app.use(naive);
|
||||||
|
|
||||||
router.isReady().then(() => {
|
router.isReady().then(() => {
|
||||||
|
console.log('---- Router is ready, now mounting the app...');
|
||||||
app.mount('#app', true);
|
app.mount('#app', true);
|
||||||
|
console.log('---- App has been mounted successfully.');
|
||||||
|
}).catch((err) => {
|
||||||
|
console.log(err);
|
||||||
});
|
});
|
||||||
|
|
|
@ -8,6 +8,11 @@ import { storeToRefs } from 'pinia';
|
||||||
import HeroGradient from '../assets/hero-gradient.svg?component';
|
import HeroGradient from '../assets/hero-gradient.svg?component';
|
||||||
import MenuLayout from '../components/MenuLayout.vue';
|
import MenuLayout from '../components/MenuLayout.vue';
|
||||||
import NavbarButtons from '../components/NavbarButtons.vue';
|
import NavbarButtons from '../components/NavbarButtons.vue';
|
||||||
|
import CLink from '@/ui/c-link/c-link.vue';
|
||||||
|
import CTooltip from '@/ui/c-tooltip/c-tooltip.vue';
|
||||||
|
import CButton from '@/ui/c-button/c-button.vue';
|
||||||
|
import CommandPalette from '@/modules/command-palette/command-palette.vue';
|
||||||
|
import LocaleSelector from '@/modules/i18n/components/locale-selector.vue';
|
||||||
import { useStyleStore } from '@/stores/style.store';
|
import { useStyleStore } from '@/stores/style.store';
|
||||||
import { config } from '@/config';
|
import { config } from '@/config';
|
||||||
import type { ToolCategory } from '@/tools/tools.types';
|
import type { ToolCategory } from '@/tools/tools.types';
|
||||||
|
@ -50,7 +55,7 @@ const tools = computed<ToolCategory[]>(() => [
|
||||||
|
|
||||||
<div class="sider-content">
|
<div class="sider-content">
|
||||||
<div v-if="styleStore.isSmallScreen" flex flex-col items-center>
|
<div v-if="styleStore.isSmallScreen" flex flex-col items-center>
|
||||||
<locale-selector w="90%" />
|
<LocaleSelector w="90%" />
|
||||||
|
|
||||||
<div flex justify-center>
|
<div flex justify-center>
|
||||||
<NavbarButtons />
|
<NavbarButtons />
|
||||||
|
@ -63,27 +68,27 @@ const tools = computed<ToolCategory[]>(() => [
|
||||||
<div>
|
<div>
|
||||||
IT-Tools
|
IT-Tools
|
||||||
|
|
||||||
<c-link target="_blank" rel="noopener" :href="`https://github.com/CorentinTh/it-tools/tree/v${version}`">
|
<CLink target="_blank" rel="noopener" :href="`https://github.com/CorentinTh/it-tools/tree/v${version}`">
|
||||||
v{{ version }}
|
v{{ version }}
|
||||||
</c-link>
|
</CLink>
|
||||||
|
|
||||||
<template v-if="commitSha && commitSha.length > 0">
|
<template v-if="commitSha && commitSha.length > 0">
|
||||||
-
|
-
|
||||||
<c-link
|
<CLink
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener"
|
rel="noopener"
|
||||||
type="primary"
|
type="primary"
|
||||||
:href="`https://github.com/CorentinTh/it-tools/tree/${commitSha}`"
|
:href="`https://github.com/CorentinTh/it-tools/tree/${commitSha}`"
|
||||||
>
|
>
|
||||||
{{ commitSha }}
|
{{ commitSha }}
|
||||||
</c-link>
|
</CLink>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
© {{ new Date().getFullYear() }}
|
© {{ new Date().getFullYear() }}
|
||||||
<c-link target="_blank" rel="noopener" href="https://github.com/CorentinTh">
|
<CLink target="_blank" rel="noopener" href="https://github.com/CorentinTh">
|
||||||
Corentin Thomasset
|
Corentin Thomasset
|
||||||
</c-link>
|
</CLink>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -91,37 +96,37 @@ const tools = computed<ToolCategory[]>(() => [
|
||||||
|
|
||||||
<template #content>
|
<template #content>
|
||||||
<div flex items-center justify-center gap-2>
|
<div flex items-center justify-center gap-2>
|
||||||
<c-button
|
<CButton
|
||||||
circle
|
circle
|
||||||
variant="text"
|
variant="text"
|
||||||
:aria-label="$t('home.toggleMenu')"
|
:aria-label="$t('home.toggleMenu')"
|
||||||
@click="styleStore.isMenuCollapsed = !styleStore.isMenuCollapsed"
|
@click="styleStore.isMenuCollapsed = !styleStore.isMenuCollapsed"
|
||||||
>
|
>
|
||||||
<NIcon size="25" :component="Menu2" />
|
<NIcon size="25" :component="Menu2" />
|
||||||
</c-button>
|
</CButton>
|
||||||
|
|
||||||
<c-tooltip :tooltip="$t('home.home')" position="bottom">
|
<CTooltip :tooltip="$t('home.home')" position="bottom">
|
||||||
<c-button to="/" circle variant="text" :aria-label="$t('home.home')">
|
<CButton to="/" circle variant="text" :aria-label="$t('home.home')">
|
||||||
<NIcon size="25" :component="Home2" />
|
<NIcon size="25" :component="Home2" />
|
||||||
</c-button>
|
</CButton>
|
||||||
</c-tooltip>
|
</CTooltip>
|
||||||
|
|
||||||
<c-tooltip :tooltip="$t('home.uiLib')" position="bottom">
|
<CTooltip :tooltip="$t('home.uiLib')" position="bottom">
|
||||||
<c-button v-if="config.app.env === 'development'" to="/c-lib" circle variant="text" :aria-label="$t('home.uiLib')">
|
<CButton v-if="config.app.env === 'development'" to="/c-lib" circle variant="text" :aria-label="$t('home.uiLib')">
|
||||||
<icon-mdi:brush-variant text-20px />
|
<icon-mdi:brush-variant text-20px />
|
||||||
</c-button>
|
</CButton>
|
||||||
</c-tooltip>
|
</CTooltip>
|
||||||
|
|
||||||
<command-palette />
|
<CommandPalette />
|
||||||
|
|
||||||
<locale-selector v-if="!styleStore.isSmallScreen" />
|
<LocaleSelector v-if="!styleStore.isSmallScreen" />
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<NavbarButtons v-if="!styleStore.isSmallScreen" />
|
<NavbarButtons v-if="!styleStore.isSmallScreen" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<c-tooltip position="bottom" :tooltip="$t('home.support')">
|
<CTooltip position="bottom" :tooltip="$t('home.support')">
|
||||||
<c-button
|
<CButton
|
||||||
round
|
round
|
||||||
href="https://www.buymeacoffee.com/cthmsst"
|
href="https://www.buymeacoffee.com/cthmsst"
|
||||||
rel="noopener"
|
rel="noopener"
|
||||||
|
@ -132,8 +137,8 @@ const tools = computed<ToolCategory[]>(() => [
|
||||||
>
|
>
|
||||||
{{ $t('home.buyMeACoffee') }}
|
{{ $t('home.buyMeACoffee') }}
|
||||||
<NIcon v-if="!styleStore.isSmallScreen" :component="Heart" ml-2 />
|
<NIcon v-if="!styleStore.isSmallScreen" :component="Heart" ml-2 />
|
||||||
</c-button>
|
</CButton>
|
||||||
</c-tooltip>
|
</CTooltip>
|
||||||
</div>
|
</div>
|
||||||
<slot />
|
<slot />
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { createToken } from './token-generator.service';
|
import { createToken } from './token-generator.service';
|
||||||
|
import CInputText from '@/ui/c-input-text/c-input-text.vue';
|
||||||
import { useCopy } from '@/composable/copy';
|
import { useCopy } from '@/composable/copy';
|
||||||
import { useQueryParam } from '@/composable/queryParams';
|
import { useQueryParam } from '@/composable/queryParams';
|
||||||
import { computedRefreshable } from '@/composable/computedRefreshable';
|
import { computedRefreshable } from '@/composable/computedRefreshable';
|
||||||
|
@ -55,7 +56,7 @@ const { copy } = useCopy({ source: token, text: t('tools.token-generator.copied'
|
||||||
<n-slider v-model:value="length" :step="1" :min="1" :max="512" />
|
<n-slider v-model:value="length" :step="1" :min="1" :max="512" />
|
||||||
</n-form-item>
|
</n-form-item>
|
||||||
|
|
||||||
<c-input-text
|
<CInputText
|
||||||
v-model:value="token"
|
v-model:value="token"
|
||||||
multiline
|
multiline
|
||||||
:placeholder="t('tools.token-generator.tokenPlaceholder')"
|
:placeholder="t('tools.token-generator.tokenPlaceholder')"
|
||||||
|
|
|
@ -11,6 +11,7 @@ import Icons from 'unplugin-icons/vite';
|
||||||
import { NaiveUiResolver } from 'unplugin-vue-components/resolvers';
|
import { NaiveUiResolver } from 'unplugin-vue-components/resolvers';
|
||||||
import Components from 'unplugin-vue-components/vite';
|
import Components from 'unplugin-vue-components/vite';
|
||||||
import { defineConfig } from 'vite';
|
import { defineConfig } from 'vite';
|
||||||
|
|
||||||
// import { VitePWA } from 'vite-plugin-pwa';
|
// import { VitePWA } from 'vite-plugin-pwa';
|
||||||
import markdown from 'vite-plugin-vue-markdown';
|
import markdown from 'vite-plugin-vue-markdown';
|
||||||
import svgLoader from 'vite-svg-loader';
|
import svgLoader from 'vite-svg-loader';
|
||||||
|
@ -114,5 +115,13 @@ export default defineConfig({
|
||||||
},
|
},
|
||||||
build: {
|
build: {
|
||||||
target: 'esnext',
|
target: 'esnext',
|
||||||
|
rollupOptions: {
|
||||||
|
// 指定入口文件
|
||||||
|
input: {
|
||||||
|
main: './src/entry-client.ts',
|
||||||
|
// 你也可以在这里指定服务器端入口,例如:
|
||||||
|
server: './src/entry-server.ts',
|
||||||
|
},
|
||||||
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue