From 3e58c6b637ab98ba15c0a014dbba783b1b6d76b1 Mon Sep 17 00:00:00 2001 From: tangly1024 Date: Wed, 1 Nov 2023 23:13:25 +0800 Subject: [PATCH] =?UTF-8?q?=E5=8A=A8=E6=80=81=E9=85=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/ExternalPlugins.js | 14 ++------ lib/config.js | 6 ++-- lib/global.js | 53 +++++++++++++++++------------- lib/lang.js | 2 +- lib/notion/getNotionConfig.js | 2 +- pages/_app.js | 5 ++- themes/hexo/components/Footer.js | 4 +-- themes/hexo/components/InfoCard.js | 2 +- 8 files changed, 43 insertions(+), 45 deletions(-) diff --git a/components/ExternalPlugins.js b/components/ExternalPlugins.js index 5b771fbb..c65836c4 100644 --- a/components/ExternalPlugins.js +++ b/components/ExternalPlugins.js @@ -2,17 +2,6 @@ import BLOG from 'blog.config' import dynamic from 'next/dynamic' import WebWhiz from './Webwhiz' -// import TwikooCommentCounter from '@/components/TwikooCommentCounter' -// import { DebugPanel } from '@/components/DebugPanel' -// import { ThemeSwitch } from '@/components/ThemeSwitch' -// import { Fireworks } from '@/components/Fireworks' -// import { Nest } from '@/components/Nest' -// import { FlutteringRibbon } from '@/components/FlutteringRibbon' -// import { Ribbon } from '@/components/Ribbon' -// import { Sakura } from '@/components/Sakura' -// import { StarrySky } from '@/components/StarrySky' -// import { Analytics } from '@vercel/analytics/react' - const TwikooCommentCounter = dynamic(() => import('@/components/TwikooCommentCounter'), { ssr: false }) const DebugPanel = dynamic(() => import('@/components/DebugPanel'), { ssr: false }) const ThemeSwitch = dynamic(() => import('@/components/ThemeSwitch'), { ssr: false }) @@ -33,8 +22,9 @@ const VConsole = dynamic(() => import('@/components/VConsole'), { ssr: false }) const CustomContextMenu = dynamic(() => import('@/components/CustomContextMenu'), { ssr: false }) const DisableCopy = dynamic(() => import('@/components/DisableCopy'), { ssr: false }) const AdBlockDetect = dynamic(() => import('@/components/AdBlockDetect'), { ssr: false }) + /** - * 各种第三方组件 + * 各种插件脚本 * @param {*} props * @returns */ diff --git a/lib/config.js b/lib/config.js index b6c99afb..ff931386 100644 --- a/lib/config.js +++ b/lib/config.js @@ -25,7 +25,7 @@ export const siteConfig = (key) => { if (global) { val = global.NOTION_CONFIG?.[key] siteInfo = global.siteInfo - console.log('当前变量', key, val) + // console.log('当前变量', key, val) } if (!val) { @@ -38,7 +38,7 @@ export const siteConfig = (key) => { val = siteInfo?.icon // 封面图取Notion的封面 break case 'TITLE': - val = siteConfig('TITLE') // 标题取Notion中的标题 + val = siteInfo?.title // 标题取Notion中的标题 break } } @@ -47,6 +47,6 @@ export const siteConfig = (key) => { if (!val) { val = BLOG[key] } - console.log('配置', key, val) + console.log('实际配置', key, val) return val } diff --git a/lib/global.js b/lib/global.js index d1fc4142..548b6d8c 100644 --- a/lib/global.js +++ b/lib/global.js @@ -2,33 +2,53 @@ import { generateLocaleDict, initLocale } from './lang' import { createContext, useContext, useEffect, useState } from 'react' import { useRouter } from 'next/router' import { THEMES, initDarkMode } from '@/themes/theme' -import NProgress from 'nprogress' -import { getQueryVariable, isBrowser } from './utils' + import BLOG from '@/blog.config' +import NProgress from 'nprogress' +import { isBrowser } from './utils' const GlobalContext = createContext() /** - * 全局变量Provider，包括语言本地化、样式主题、搜索词 + * 定义全局变量，包括语言、主题、深色模式、加载状态 * @param children * @returns {JSX.Element} * @constructor */ export function GlobalContextProvider(props) { const { children, siteInfo, categoryOptions, tagOptions, NOTION_CONFIG } = props + console.log('config', NOTION_CONFIG) const router = useRouter() - const [lang, updateLang] = useState(BLOG.LANG) // 默认语言 - const [locale, updateLocale] = useState(generateLocaleDict(BLOG.LANG)) // 默认语言 - const [theme, setTheme] = useState(BLOG.THEME) // 默认博客主题 - const [isDarkMode, updateDarkMode] = useState(BLOG.APPEARANCE === 'dark') // 默认深色模式 + const [lang, updateLang] = useState(NOTION_CONFIG.LANG || BLOG.LANG) // 默认语言 + const [locale, updateLocale] = useState(generateLocaleDict(NOTION_CONFIG.LANG || BLOG.LANG)) // 默认语言 + const [theme, setTheme] = useState(NOTION_CONFIG.THEME || BLOG.THEME) // 默认博客主题 + const [isDarkMode, updateDarkMode] = useState(NOTION_CONFIG.APPEARANCE || BLOG.APPEARANCE === 'dark') // 默认深色模式 const [onLoading, setOnLoading] = useState(false) // 抓取文章数据 + // 切换主题 + function switchTheme() { + const currentIndex = THEMES.indexOf(theme) + const newIndex = currentIndex < THEMES.length - 1 ? currentIndex + 1 : 0 + const newTheme = THEMES[newIndex] + const query = router.query + query.theme = newTheme + router.push({ pathname: router.pathname, query }) + return newTheme + } + useEffect(() => { initLocale(lang, locale, updateLang, updateLocale) initDarkMode(updateDarkMode) - initTheme() + checkThemeDOM() }, []) + // 加载默认主题 + // useEffect(() => { + // const queryTheme = getQueryVariable('theme') || theme + // setTheme(queryTheme) + // }, [router]) + + // 加载进度条 useEffect(() => { const handleStart = (url) => { NProgress.start() @@ -43,8 +63,6 @@ export function GlobalContextProvider(props) { NProgress.done() setOnLoading(false) } - const queryTheme = getQueryVariable('theme') || BLOG.THEME - setTheme(queryTheme) router.events.on('routeChangeStart', handleStart) router.events.on('routeChangeError', handleStop) router.events.on('routeChangeComplete', handleStop) @@ -55,22 +73,13 @@ export function GlobalContextProvider(props) { } }, [router]) - // 切换主题 - function switchTheme() { - const currentIndex = THEMES.indexOf(theme) - const newIndex = currentIndex < THEMES.length - 1 ? currentIndex + 1 : 0 - const newTheme = THEMES[newIndex] - const query = router.query - query.theme = newTheme - router.push({ pathname: router.pathname, query }) - return newTheme - } - return ( { +const checkThemeDOM = () => { if (isBrowser) { setTimeout(() => { const elements = document.querySelectorAll('[id^="theme-"]') diff --git a/lib/lang.js b/lib/lang.js index abc51354..d69da08f 100644 --- a/lib/lang.js +++ b/lib/lang.js @@ -65,7 +65,7 @@ export function generateLocaleDict(langString) { */ export function initLocale(lang, locale, changeLang, changeLocale) { if (isBrowser) { - const queryLang = getQueryVariable('lang') || loadLangFromCookies() || window.navigator.language + const queryLang = getQueryVariable('lang') || loadLangFromCookies() let currentLang = lang if (queryLang !== lang) { currentLang = queryLang diff --git a/lib/notion/getNotionConfig.js b/lib/notion/getNotionConfig.js index d5d51f51..d03eeaca 100644 --- a/lib/notion/getNotionConfig.js +++ b/lib/notion/getNotionConfig.js @@ -127,7 +127,7 @@ export async function getConfigMapFromConfigPage(allPages) { // 只导入生效的配置 if (config.enable) { - // console.log('[覆盖代码配置]', config.key) + console.log('[Notion配置]', config.key, config.value) notionConfig[config.key] = config.value } } diff --git a/pages/_app.js b/pages/_app.js index a16513b9..a19933cb 100644 --- a/pages/_app.js +++ b/pages/_app.js @@ -11,12 +11,11 @@ import { GlobalContextProvider } from '@/lib/global' import AOS from 'aos' import 'aos/dist/aos.css' // You can also use for styles -import dynamic from 'next/dynamic' import { isBrowser, loadExternalResource } from '@/lib/utils' import BLOG from '@/blog.config' - // 各种扩展插件 动画等 -const ExternalPlugins = dynamic(() => import('@/components/ExternalPlugins')) +import ExternalPlugins from '@/components/ExternalPlugins' +// const ExternalPlugins = dynamic(() => import('@/components/ExternalPlugins')) const MyApp = ({ Component, pageProps }) => { // 自定义样式css和js引入 diff --git a/themes/hexo/components/Footer.js b/themes/hexo/components/Footer.js index 3ccda463..ced637e9 100644 --- a/themes/hexo/components/Footer.js +++ b/themes/hexo/components/Footer.js @@ -26,8 +26,8 @@ const Footer = ({ title }) => { -

{title} {BLOG.BIO && <>|} {BLOG.BIO}

-

Powered by NotionNext {BLOG.VERSION}.


+

{title} {siteConfig('BIO') && <>|} {siteConfig('BIO')}

+

Powered by NotionNext {siteConfig('VERSION')}.


) diff --git a/themes/hexo/components/InfoCard.js b/themes/hexo/components/InfoCard.js index 4f62a120..0676f8f7 100644 --- a/themes/hexo/components/InfoCard.js +++ b/themes/hexo/components/InfoCard.js @@ -26,7 +26,7 @@ export function InfoCard(props) {
{siteConfig('AUTHOR')}
-
{BLOG.BIO}
+
{siteConfig('BIO')}