From 2a584362c3cd9f0bec469eb4a77ad07447241c15 Mon Sep 17 00:00:00 2001 From: "tangly1024.com" Date: Thu, 8 Feb 2024 14:34:59 +0800 Subject: [PATCH] =?UTF-8?q?=E4=B8=BB=E9=A2=98=E8=AF=BB=E5=8F=96=E9=80=BB?= =?UTF-8?q?=E8=BE=91=EF=BC=8C=E6=94=B9=E4=B8=BA=E4=B8=BB=E9=A2=98=E8=87=AA?= =?UTF-8?q?=E5=B7=B1=E5=A4=84=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- blog.config.js | 22 +++++++++++++++++++ themes/example/index.js | 21 ++++++++++++++++-- themes/fukasawa/index.js | 19 ++++++++++++++++- themes/gitbook/index.js | 21 ++++++++++++++++-- themes/heo/index.js | 21 ++++++++++++++++-- themes/hexo/index.js | 19 ++++++++++++++++- themes/landing-2/index.js | 18 +++++++++++++++- themes/landing/index.js | 19 ++++++++++++++++- themes/matery/index.js | 19 ++++++++++++++++- themes/medium/index.js | 19 ++++++++++++++++- themes/nav/index.js | 19 ++++++++++++++++- themes/next/index.js | 19 ++++++++++++++++- themes/nobelium/index.js | 19 ++++++++++++++++- themes/plog/index.js | 19 ++++++++++++++++- themes/simple/index.js | 19 ++++++++++++++++- themes/theme.js | 45 ++++----------------------------------- 16 files changed, 280 insertions(+), 58 deletions(-) diff --git a/blog.config.js b/blog.config.js index 4677c555..50acd55f 100644 --- a/blog.config.js +++ b/blog.config.js @@ -91,6 +91,28 @@ const BLOG = { FONT_AWESOME: process.env.NEXT_PUBLIC_FONT_AWESOME_PATH || 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css', // font-awesome 字体图标地址; 可选 /css/all.min.css ， https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/font-awesome/6.0.0/css/all.min.css // END ************网站字体***************** + + // 路径和组件映射，不同路径分别展示主题的什么组件 + LAYOUT_MAPPINGS: { + '-1': 'LayoutBase', + '/': 'LayoutIndex', + '/archive': 'LayoutArchive', + '/page/[page]': 'LayoutPostList', + '/category/[category]': 'LayoutPostList', + '/category/[category]/page/[page]': 'LayoutPostList', + '/tag/[tag]': 'LayoutPostList', + '/tag/[tag]/page/[page]': 'LayoutPostList', + '/search': 'LayoutSearch', + '/search/[keyword]': 'LayoutSearch', + '/search/[keyword]/page/[page]': 'LayoutSearch', + '/404': 'Layout404', + '/tag': 'LayoutTagIndex', + '/category': 'LayoutCategoryIndex', + '/[prefix]': 'LayoutSlug', + '/[prefix]/[slug]': 'LayoutSlug', + '/[prefix]/[slug]/[...suffix]': 'LayoutSlug' + }, + CAN_COPY: process.env.NEXT_PUBLIC_CAN_COPY || true, // 是否允许复制页面内容 默认允许，如果设置为false、则全栈禁止复制内容。 CUSTOM_RIGHT_CLICK_CONTEXT_MENU: process.env.NEXT_PUBLIC_CUSTOM_RIGHT_CLICK_CONTEXT_MENU || true, // 自定义右键菜单，覆盖系统菜单 CUSTOM_RIGHT_CLICK_CONTEXT_MENU_THEME_SWITCH: process.env.NEXT_PUBLIC_CUSTOM_RIGHT_CLICK_CONTEXT_MENU_THEME_SWITCH || true, diff --git a/themes/example/index.js b/themes/example/index.js index ed1c5bda..099a334c 100644 --- a/themes/example/index.js +++ b/themes/example/index.js @@ -26,6 +26,7 @@ import { useRouter } from 'next/router' import { Transition } from '@headlessui/react' import { Style } from './style' import { siteConfig } from '@/lib/config' +import { LAYOUT_MAPPINGS } from '@/blog.config' /** * 基础布局框架 @@ -245,15 +246,31 @@ const LayoutTagIndex = (props) => { ) } +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, LayoutIndex, - LayoutPostList, LayoutSearch, LayoutArchive, LayoutSlug, Layout404, + LayoutPostList, LayoutCategoryIndex, - LayoutTagIndex + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/fukasawa/index.js b/themes/fukasawa/index.js index 4d5bfe43..159ac237 100644 --- a/themes/fukasawa/index.js +++ b/themes/fukasawa/index.js @@ -21,6 +21,7 @@ import { Style } from './style' import replaceSearchResult from '@/components/Mark' import { siteConfig } from '@/lib/config' import WWAds from '@/components/WWAds' +import { LAYOUT_MAPPINGS } from '@/blog.config' const Live2D = dynamic(() => import('@/components/Live2D')) @@ -233,6 +234,21 @@ const LayoutTagIndex = (props) => { } +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, @@ -243,5 +259,6 @@ export { Layout404, LayoutPostList, LayoutCategoryIndex, - LayoutTagIndex + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/gitbook/index.js b/themes/gitbook/index.js index cd4f2207..928ec9ad 100644 --- a/themes/gitbook/index.js +++ b/themes/gitbook/index.js @@ -34,6 +34,7 @@ import Link from 'next/link' import dynamic from 'next/dynamic' import { siteConfig } from '@/lib/config' import NotionIcon from '@/components/NotionIcon' +import { LAYOUT_MAPPINGS } from '@/blog.config' const WWAds = dynamic(() => import('@/components/WWAds'), { ssr: false }) // 主题全局变量 @@ -342,6 +343,21 @@ const LayoutTagIndex = (props) => { } +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, @@ -350,7 +366,8 @@ export { LayoutArchive, LayoutSlug, Layout404, - LayoutCategoryIndex, LayoutPostList, - LayoutTagIndex + LayoutCategoryIndex, + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/heo/index.js b/themes/heo/index.js index 54d328ed..e32a59c6 100644 --- a/themes/heo/index.js +++ b/themes/heo/index.js @@ -39,6 +39,7 @@ import LazyImage from '@/components/LazyImage' import WWAds from '@/components/WWAds' import { AdSlot } from '@/components/GoogleAdsense' import { siteConfig } from '@/lib/config' +import { LAYOUT_MAPPINGS } from '@/blog.config' /** * 基础布局 采用上中下布局，移动端使用顶部侧边导航栏 @@ -481,6 +482,21 @@ const LayoutTagIndex = props => { ) } +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, @@ -489,7 +505,8 @@ export { LayoutArchive, LayoutSlug, Layout404, - LayoutCategoryIndex, LayoutPostList, - LayoutTagIndex + LayoutCategoryIndex, + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/hexo/index.js b/themes/hexo/index.js index 4015a0c7..46660580 100644 --- a/themes/hexo/index.js +++ b/themes/hexo/index.js @@ -32,6 +32,7 @@ import { Style } from './style' import replaceSearchResult from '@/components/Mark' import { siteConfig } from '@/lib/config' import AlgoliaSearchModal from '@/components/AlgoliaSearchModal' +import { LAYOUT_MAPPINGS } from '@/blog.config' // 主题全局状态 const ThemeGlobalHexo = createContext() @@ -349,6 +350,21 @@ const LayoutTagIndex = props => { ) } +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, @@ -359,5 +375,6 @@ export { Layout404, LayoutCategoryIndex, LayoutPostList, - LayoutTagIndex + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/landing-2/index.js b/themes/landing-2/index.js index 4f176578..7e660c2e 100644 --- a/themes/landing-2/index.js +++ b/themes/landing-2/index.js @@ -29,6 +29,7 @@ import { Brand } from './components/Brand' import { Footer } from './components/Footer' import { BackToTopButton } from './components/BackToTopButton' import { MadeWithButton } from './components/MadeWithButton' +import { LAYOUT_MAPPINGS } from '@/blog.config' /** * 一些外部js @@ -126,6 +127,20 @@ const Layout404 = (props) => <> const LayoutCategoryIndex = (props) => <> const LayoutPostList = (props) => <> const LayoutTagIndex = (props) => <> +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} export { CONFIG as THEME_CONFIG, @@ -137,5 +152,6 @@ export { Layout404, LayoutPostList, LayoutCategoryIndex, - LayoutTagIndex + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/landing/index.js b/themes/landing/index.js index e6ccba66..cee99448 100644 --- a/themes/landing/index.js +++ b/themes/landing/index.js @@ -21,6 +21,7 @@ import Loading from '@/components/Loading' import { isBrowser } from '@/lib/utils' import { siteConfig } from '@/lib/config' import { Pricing } from './components/Pricing' +import { LAYOUT_MAPPINGS } from '@/blog.config' /** * 布局框架 @@ -94,6 +95,21 @@ const LayoutCategoryIndex = (props) => <> const LayoutPostList = (props) => <> const LayoutTagIndex = (props) => <> +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, @@ -104,5 +120,6 @@ export { Layout404, LayoutPostList, LayoutCategoryIndex, - LayoutTagIndex + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/matery/index.js b/themes/matery/index.js index 51193157..81bcc469 100644 --- a/themes/matery/index.js +++ b/themes/matery/index.js @@ -30,6 +30,7 @@ import { Transition } from '@headlessui/react' import { Style } from './style' import replaceSearchResult from '@/components/Mark' import { siteConfig } from '@/lib/config' +import { LAYOUT_MAPPINGS } from '@/blog.config' /** * 基础布局 @@ -362,6 +363,21 @@ const LayoutTagIndex = props => { ) } +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, @@ -372,5 +388,6 @@ export { LayoutSlug, Layout404, LayoutCategoryIndex, - LayoutTagIndex + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/medium/index.js b/themes/medium/index.js index 3b2e0b90..608e498c 100644 --- a/themes/medium/index.js +++ b/themes/medium/index.js @@ -34,6 +34,7 @@ import { Style } from './style' import replaceSearchResult from '@/components/Mark' import ArticleInfo from './components/ArticleInfo' import { siteConfig } from '@/lib/config' +import { LAYOUT_MAPPINGS } from '@/blog.config' // 主题全局状态 const ThemeGlobalMedium = createContext() @@ -329,6 +330,21 @@ const LayoutTagIndex = props => { ) } +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, @@ -339,5 +355,6 @@ export { LayoutSlug, Layout404, LayoutCategoryIndex, - LayoutTagIndex + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/nav/index.js b/themes/nav/index.js index 1e263050..3defaabf 100755 --- a/themes/nav/index.js +++ b/themes/nav/index.js @@ -34,6 +34,7 @@ import { siteConfig } from '@/lib/config' import Live2D from '@/components/Live2D' import BlogArchiveItem from './components/BlogArchiveItem' import NotionIcon from '@/components/NotionIcon' +import { LAYOUT_MAPPINGS } from '@/blog.config' const WWAds = dynamic(() => import('@/components/WWAds'), { ssr: false }) @@ -327,6 +328,21 @@ const LayoutTagIndex = (props) => { return <> } +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, @@ -337,5 +353,6 @@ export { Layout404, LayoutCategoryIndex, LayoutPostList, - LayoutTagIndex + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/next/index.js b/themes/next/index.js index 26aada54..bc0c5f83 100644 --- a/themes/next/index.js +++ b/themes/next/index.js @@ -27,6 +27,7 @@ import { siteConfig } from '@/lib/config' import AlgoliaSearchModal from '@/components/AlgoliaSearchModal' import Announcement from './components/Announcement' import Card from './components/Card' +import { LAYOUT_MAPPINGS } from '@/blog.config' // 主题全局状态 const ThemeGlobalNext = createContext() @@ -342,6 +343,21 @@ const LayoutTagIndex = (props) => { } +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, @@ -352,5 +368,6 @@ export { Layout404, LayoutCategoryIndex, LayoutPostList, - LayoutTagIndex + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/nobelium/index.js b/themes/nobelium/index.js index 64e0a905..cdeb8a3e 100644 --- a/themes/nobelium/index.js +++ b/themes/nobelium/index.js @@ -24,6 +24,7 @@ import { Style } from './style' import replaceSearchResult from '@/components/Mark' import AlgoliaSearchModal from '@/components/AlgoliaSearchModal' import { siteConfig } from '@/lib/config' +import { LAYOUT_MAPPINGS } from '@/blog.config' // 主题全局状态 const ThemeGlobalNobelium = createContext() @@ -286,6 +287,21 @@ const LayoutTagIndex = (props) => { ) } +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, @@ -296,5 +312,6 @@ export { Layout404, LayoutPostList, LayoutCategoryIndex, - LayoutTagIndex + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/plog/index.js b/themes/plog/index.js index 9b8b2d22..36e30a56 100644 --- a/themes/plog/index.js +++ b/themes/plog/index.js @@ -21,6 +21,7 @@ import Modal from './components/Modal' import { Style } from './style' import replaceSearchResult from '@/components/Mark' import { useRouter } from 'next/router' +import { LAYOUT_MAPPINGS } from '@/blog.config' // 主题全局状态 const ThemeGlobalPlog = createContext() @@ -252,6 +253,21 @@ const LayoutTagIndex = (props) => { ) } +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, @@ -262,5 +278,6 @@ export { Layout404, LayoutPostList, LayoutCategoryIndex, - LayoutTagIndex + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/simple/index.js b/themes/simple/index.js index 8e57f3bb..62cdad60 100644 --- a/themes/simple/index.js +++ b/themes/simple/index.js @@ -11,6 +11,7 @@ import replaceSearchResult from '@/components/Mark' import dynamic from 'next/dynamic' import NotionPage from '@/components/NotionPage' import AlgoliaSearchModal from '@/components/AlgoliaSearchModal' +import { LAYOUT_MAPPINGS } from '@/blog.config' // 主题组件 const BlogListScroll = dynamic(() => import('./components/BlogListScroll'), { ssr: false }); @@ -278,6 +279,21 @@ const LayoutTagIndex = (props) => { ) } +/** + * 根据路径 获取对应的layout + * @param {*} path + * @returns + */ +const getLayoutNameByPath = (path) => { + // 检查特殊处理的路径 + if (LAYOUT_MAPPINGS[path]) { + return LAYOUT_MAPPINGS[path]; + } else { + // 没有特殊处理的路径返回默认layout名称 + return 'LayoutSlug'; + } +} + export { CONFIG as THEME_CONFIG, LayoutBase, @@ -288,5 +304,6 @@ export { Layout404, LayoutCategoryIndex, LayoutPostList, - LayoutTagIndex + LayoutTagIndex, + getLayoutNameByPath } diff --git a/themes/theme.js b/themes/theme.js index 599621e2..ddb30a77 100644 --- a/themes/theme.js +++ b/themes/theme.js @@ -13,11 +13,10 @@ export const { THEMES = [] } = getConfig().publicRuntimeConfig * @returns */ export const getGlobalLayoutByTheme = (themeQuery) => { - const layout = getLayoutNameByPath(-1) if (themeQuery !== BLOG.THEME) { - return dynamic(() => import(`@/themes/${themeQuery}`).then(m => m[layout]), { ssr: true }) + return dynamic(() => import(`@/themes/${themeQuery}`).then(m => m[m.getLayoutNameByPath(-1)]), { ssr: true }) } else { - return ThemeComponents[layout] + return ThemeComponents[ThemeComponents.getLayoutNameByPath('-1')] } } @@ -29,20 +28,18 @@ export const getGlobalLayoutByTheme = (themeQuery) => { */ export const getLayoutByTheme = ({ router, theme }) => { const themeQuery = getQueryParam(router.asPath, 'theme') || theme - const layoutName = getLayoutNameByPath(router.pathname) - if (themeQuery !== BLOG.THEME) { return dynamic(() => import(`@/themes/${themeQuery}`).then(m => { setTimeout(() => { checkThemeDOM() }, 500); - return m[layoutName] + return m[m.getLayoutNameByPath(router.pathname)] }), { ssr: true }) } else { setTimeout(() => { checkThemeDOM() }, 100); - return ThemeComponents[layoutName] + return ThemeComponents[ThemeComponents.getLayoutNameByPath('-1')] } } @@ -62,40 +59,6 @@ const checkThemeDOM = () => { } } -/** - * 根据路径 获取对应的layout - * @param {*} path - * @returns - */ -export const getLayoutNameByPath = (path) => { - switch (path) { - case -1: - return 'LayoutBase' - case '/': - return 'LayoutIndex' - case '/archive': - return 'LayoutArchive' - case '/page/[page]': - case '/category/[category]': - case '/category/[category]/page/[page]': - case '/tag/[tag]': - case '/tag/[tag]/page/[page]': - return 'LayoutPostList' - case '/search': - case '/search/[keyword]': - case '/search/[keyword]/page/[page]': - return 'LayoutSearch' - case '/404': - return 'Layout404' - case '/tag': - return 'LayoutTagIndex' - case '/category': - return 'LayoutCategoryIndex' - default: - return 'LayoutSlug' - } -} - /** * 初始化主题 , 优先级 query > cookies > systemPrefer * @param isDarkMode