feat: 优化 html 构建输出

This commit is contained in:
pengzhanbo 2024-01-01 08:44:57 +08:00
parent a798601680
commit a69a8ead5d
3 changed files with 28 additions and 9 deletions

View File

@ -6,7 +6,7 @@ import type {
PlumeThemeLocaleOptions,
PlumeThemePageData,
} from '../shared/index.js'
import { normalizePath } from './utils.js'
import { pathJoin } from './utils.js'
export async function setupPage(
app: App,
@ -18,7 +18,7 @@ export async function setupPage(
const defaultBlog = localeOption.blog
const link = blog?.link
? blog.link
: normalizePath(path.join('/', locale, defaultBlog?.link || '/blog/'))
: pathJoin('/', locale, defaultBlog?.link || '/blog/')
const blogPage = await createPage(app, {
path: link,
frontmatter: {
@ -30,7 +30,7 @@ export async function setupPage(
if (blog?.tags !== false || defaultBlog?.tags !== false) {
const tagsPage = await createPage(app, {
path: normalizePath(path.join(link, 'tags/')),
path: pathJoin(link, 'tags/'),
frontmatter: {
lang: locale.replace(/^\/|\/$/g, '') || app.siteData.lang,
type: 'blog-tags',
@ -41,7 +41,7 @@ export async function setupPage(
if (blog?.archives !== false || defaultBlog?.archives !== false) {
const archivesPage = await createPage(app, {
path: normalizePath(path.join(link, 'archives/')),
path: pathJoin(link, 'archives/'),
frontmatter: {
lang: locale.replace(/^\/|\/$/g, '') || app.siteData.lang,
type: 'blog-archives',

View File

@ -1,5 +1,5 @@
import type { App, Page, Theme } from '@vuepress/core'
import { getDirname, path } from '@vuepress/utils'
import { fs, getDirname, path, templateRenderer } from '@vuepress/utils'
import type { PlumeThemeOptions, PlumeThemePageData } from '../shared/index.js'
import { mergeLocaleOptions } from './defaultOptions.js'
import { setupPlugins } from './plugins.js'
@ -10,20 +10,38 @@ const name = 'vuepress-theme-plume'
const resolve = (...args: string[]) => path.resolve(__dirname, '../', ...args)
const templates = (url: string) => resolve('../templates', url)
function getThemePackage() {
let pkg = {} as any
try {
const content = fs.readFileSync(resolve('../package.json'), 'utf-8')
pkg = JSON.parse(content)
}
catch {}
return pkg
}
export function plumeTheme({
themePlugins = {},
...localeOptions
}: PlumeThemeOptions = {}): Theme {
localeOptions = mergeLocaleOptions(localeOptions)
const pkg = getThemePackage()
return (app: App) => {
return {
name,
templateBuild: templates('build.html'),
clientConfigFile: resolve('client/config.js'),
plugins: setupPlugins(app, themePlugins, localeOptions),
onInitialized: async app => await setupPage(app, localeOptions),
onInitialized: app => setupPage(app, localeOptions),
extendsPage: (page: Page<PlumeThemePageData>) =>
extendsPageData(app, page, localeOptions),
templateBuildRenderer(template, context) {
template = template
.replace('{{ themeVersion }}', pkg.version || '')
.replace(/^\s+|\s+$/gm, '')
.replace(/\n/g, '')
return templateRenderer(template, context)
},
}
}
}

View File

@ -4,11 +4,12 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="generator" content="VuePress {{ version }}">
<meta name="theme" content="VuePress Theme Plume {{ themeVersion }}">
<script>
(function() {
const userMode = localStorage.getItem('vuepress-theme-appearance');
const systemDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
if (userMode === 'dark' || (userMode !== 'light' && systemDarkMode)) {
const um = localStorage.getItem('vuepress-theme-appearance');
const sm = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
if (um === 'dark' || (um !== 'light' && sm)) {
document.documentElement.classList.add('dark');
}
})();