完善:主题配置

This commit is contained in:
2022-08-16 17:53:09 +08:00
parent 8a5ae2abff
commit de7e62a824
7 changed files with 23 additions and 33 deletions

View File

@@ -12,7 +12,7 @@ export const markdown: MarkdownOptions = {
config: (md) => { config: (md) => {
md.renderer.rules.heading_close = (tokens, idx, options, env, slf) => { md.renderer.rules.heading_close = (tokens, idx, options, env, slf) => {
let htmlResult = slf.renderToken(tokens, idx, options, env, slf) let htmlResult = slf.renderToken(tokens, idx, options, env, slf)
if (tokens[idx].tag === 'h1') htmlResult += `\n<ArticleMetadata v-if="$frontmatter?.aside ?? true" :article="$frontmatter" />` if (tokens[idx].tag === 'h1') htmlResult += `\n<ArticleMetadata v-if="($frontmatter?.aside ?? true) && ($frontmatter?.showArticleMetadata ?? true)" :article="$frontmatter" />`
return htmlResult return htmlResult
} }
} }

View File

@@ -17,10 +17,8 @@ export const sidebar: DefaultTheme.Config['sidebar'] = {
* @returns {DefaultTheme.SidebarGroup[]} * @returns {DefaultTheme.SidebarGroup[]}
*/ */
function getItemsByDate (path: string) { function getItemsByDate (path: string) {
// 侧边栏分组数组 // 侧边栏年份分组数组
let groups: DefaultTheme.SidebarGroup[] = [] let yearGroups: DefaultTheme.SidebarGroup[] = []
// 侧边栏分组下标题数组
let items: DefaultTheme.SidebarItem[] = []
// 1.获取所有年份目录 // 1.获取所有年份目录
sync(`docs/${path}/*`, { sync(`docs/${path}/*`, {
@@ -28,12 +26,16 @@ function getItemsByDate (path: string) {
objectMode: true objectMode: true
}).forEach(({ name }) => { }).forEach(({ name }) => {
let year = name let year = name
// 侧边栏文章标题数组
let articleItems: DefaultTheme.SidebarItem[] = []
// 2.获取所有月份目录 // 2.获取所有月份目录
sync(`docs/${path}/${year}/*`, { sync(`docs/${path}/${year}/*`, {
onlyDirectories: true, onlyDirectories: true,
objectMode: true objectMode: true
}).forEach(({ name }) => { }).forEach(({ name }) => {
let month = name let month = name
// 3.获取所有日期目录 // 3.获取所有日期目录
sync(`docs/${path}/${year}/${month}/*`, { sync(`docs/${path}/${year}/${month}/*`, {
onlyDirectories: true, onlyDirectories: true,
@@ -46,36 +48,25 @@ function getItemsByDate (path: string) {
objectMode: true objectMode: true
}).forEach(({ name }) => { }).forEach(({ name }) => {
// 向前追加标题 // 向前追加标题
items.unshift({ articleItems.unshift({
text: name, text: name.replace('.md', ''),
link: `/${path}/${year}/${month}/${day}/${name}` link: `/${path}/${year}/${month}/${day}/${name}`
}) })
}) })
}) })
})
// 5.向前追加到分组 yearGroups.unshift({
if (items.length > 0) { text: `${year}年 (共 ${articleItems.length} 篇)`,
// 去除标题名中的扩展名 collapsible: true,
for (let i = 0; i < items.length; i++) { collapsed: true,
let text = items[i].text items: articleItems
items[i].text = text.replace('.md', '')
}
groups.unshift({
text: `${year}${month}月 (${items.length}篇)`,
collapsible: true,
collapsed: true,
items: items
})
}
// 6.清空侧边栏分组下标题数组
items = []
}) })
}) })
// 7.将第一个侧边栏分组的标题展开 // 将第一个侧边栏分组展开
groups[0].collapsed = false yearGroups[0].collapsed = false
return groups return yearGroups
} }
/** /**

View File

@@ -7,7 +7,7 @@ export const themeConfig: DefaultTheme.Config = {
sidebar, // 侧边栏配置 sidebar, // 侧边栏配置
logo: '/logo.png', logo: '/logo.png',
outlineTitle: '目录', // 右侧边栏的大纲标题文本配置 outlineTitle: '目录', // 右侧大纲标题文本配置
lastUpdatedText: '最后更新', // 最后更新时间文本配置, 需先配置lastUpdated为true lastUpdatedText: '最后更新', // 最后更新时间文本配置, 需先配置lastUpdated为true
// 文档页脚文本配置 // 文档页脚文本配置
docFooter: { docFooter: {

View File

@@ -33,7 +33,7 @@
<template #icon> <template #icon>
<svg class="icon" role="img" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"><path d="M832 64H192c-17.7 0-32 14.3-32 32v832c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V96c0-17.7-14.3-32-32-32z m-260 72h96v209.9L621.5 312 572 347.4V136z m220 752H232V136h280v296.9c0 3.3 1 6.6 3 9.3a15.9 15.9 0 0 0 22.3 3.7l83.8-59.9 81.4 59.4c2.7 2 6 3.1 9.4 3.1 8.8 0 16-7.2 16-16V136h64v752z"></path></svg> <svg class="icon" role="img" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"><path d="M832 64H192c-17.7 0-32 14.3-32 32v832c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V96c0-17.7-14.3-32-32-32z m-260 72h96v209.9L621.5 312 572 347.4V136z m220 752H232V136h280v296.9c0 3.3 1 6.6 3 9.3a15.9 15.9 0 0 0 22.3 3.7l83.8-59.9 81.4 59.4c2.7 2 6 3.1 9.4 3.1 8.8 0 16-7.2 16-16V136h64v752z"></path></svg>
</template> </template>
{{ $year }} ( {{ $articleData.length }} ) {{ $year }} ( {{ $articleData.length }} )
</a-tag> </a-tag>
<a-tag <a-tag
v-else v-else
@@ -79,7 +79,6 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { onMounted, watchEffect } from 'vue'
import articleData from '../../../../article-data.json' import articleData from '../../../../article-data.json'
import { formatDate, getQueryParam, goToLink } from '../utils.ts' import { formatDate, getQueryParam, goToLink } from '../utils.ts'

View File

@@ -1,7 +1,7 @@
--- ---
showArticleMetadata: false
editLink: false editLink: false
lastUpdated: false lastUpdated: false
aside: false
showComment: false showComment: false
--- ---

View File

@@ -1,7 +1,7 @@
--- ---
showArticleMetadata: false
editLink: false editLink: false
lastUpdated: false lastUpdated: false
aside: false
showComment: false showComment: false
--- ---

View File

@@ -1,7 +1,7 @@
--- ---
showArticleMetadata: false
editLink: false editLink: false
lastUpdated: false lastUpdated: false
aside: false
showComment: false showComment: false
--- ---