Skip to content

Commit 2dce4b3

Browse files
author
catlog22
committed
fix(docs): resolve hydration mismatch and favicon 404 issues
- Add minimal theme preload script to prevent FOUC - Fix favicon path to use base variable for GitHub Pages - Theme script only sets data-theme attribute (no color mode) - Maintains SSR/client consistency while eliminating flash Fixes: - Hydration mismatch error from localStorage access before Vue mount - Favicon 404 on GitHub Pages deployment - FOUC when theme applies after hydration The new script is minimal and safe: - Runs synchronously in head (before render) - Only reads localStorage and sets attribute - Matches what ThemeSwitcher.vue will do after mount - No DOM manipulation that could cause mismatch
1 parent b780734 commit 2dce4b3

1 file changed

Lines changed: 10 additions & 0 deletions

File tree

docs/.vitepress/config.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,16 @@ export default withMermaid(defineConfig({
2020
ignoreDeadLinks: true,
2121
head: [
2222
['link', { rel: 'icon', href: `${base}favicon.svg`, type: 'image/svg+xml' }],
23+
[
24+
'script',
25+
{},
26+
`(function() {
27+
try {
28+
var theme = localStorage.getItem('ccw-theme') || 'blue';
29+
document.documentElement.setAttribute('data-theme', theme);
30+
} catch (e) {}
31+
})()`
32+
],
2333
['meta', { name: 'theme-color', content: '#3b82f6' }],
2434
['meta', { name: 'og:type', content: 'website' }],
2535
['meta', { name: 'og:locale', content: 'en_US' }],

0 commit comments

Comments
 (0)