works on render

pull/588/head
Georges Gomes 4 years ago
parent 78ff8d240f
commit 57a51fa307

@ -1,6 +1,5 @@
import { watchEffect, Ref } from 'vue' import { watchEffect, Ref } from 'vue'
import { HeadConfig, SiteData } from '../../shared' import { HeadConfig, SiteData, processHead } from '../../shared'
import { processHead } from '../../../shared/shared'
import { Route } from '../router' import { Route } from '../router'
export function useUpdateHead(route: Route, siteDataByRouteRef: Ref<SiteData>) { export function useUpdateHead(route: Route, siteDataByRouteRef: Ref<SiteData>) {
@ -58,20 +57,15 @@ export function useUpdateHead(route: Route, siteDataByRouteRef: Ref<SiteData>) {
const pageData = route.data const pageData = route.data
const siteData = siteDataByRouteRef.value const siteData = siteDataByRouteRef.value
const pageTitle = pageData && pageData.title const pageTitle = pageData && pageData.title
const pageDescription = pageData && pageData.description //const pageDescription = pageData && pageData.description
const frontmatterHead = pageData && pageData.frontmatter.head
// update title and description // update title and description
document.title = (pageTitle ? pageTitle + ` | ` : ``) + siteData.title document.title = (pageTitle ? pageTitle + ` | ` : ``) + siteData.title
document document
.querySelector(`meta[name=description]`)! .querySelector(`meta[name=description]`)!
.setAttribute('content', pageDescription || siteData.description) .setAttribute('content', JSON.stringify(siteData.head))//pageDescription || siteData.description)
updateHeadTags([ updateHeadTags(processHead(siteData.head, pageData))
// site head can only change during dev
...(import.meta.env.DEV ? processHead(siteData.head, pageData) : []),
...(frontmatterHead ? filterOutHeadDescription(frontmatterHead) : [])
])
}) })
} }
@ -85,15 +79,3 @@ function createHeadElement([tag, attrs, innerHTML]: HeadConfig) {
} }
return el return el
} }
function isMetaDescription(headConfig: HeadConfig) {
return (
headConfig[0] === 'meta' &&
headConfig[1] &&
headConfig[1].name === 'description'
)
}
function filterOutHeadDescription(head: HeadConfig[]) {
return head.filter((h) => !isMetaDescription(h))
}

@ -3,6 +3,7 @@ import { Route } from './router'
import serializedSiteData from '@siteData' import serializedSiteData from '@siteData'
import { resolveSiteDataByRoute, PageData, SiteData } from '../shared' import { resolveSiteDataByRoute, PageData, SiteData } from '../shared'
import { withBase } from './utils' import { withBase } from './utils'
import { HeadConfig } from 'dist/vitepress'
export const dataSymbol: InjectionKey<VitePressData> = Symbol() export const dataSymbol: InjectionKey<VitePressData> = Symbol()
@ -10,6 +11,7 @@ export interface VitePressData<T = any> {
site: Ref<SiteData<T>> site: Ref<SiteData<T>>
page: Ref<PageData> page: Ref<PageData>
theme: Ref<T> theme: Ref<T>
head: Ref<HeadConfig[] | ((pageData: PageData) => HeadConfig[])>
frontmatter: Ref<PageData['frontmatter']> frontmatter: Ref<PageData['frontmatter']>
title: Ref<string> title: Ref<string>
description: Ref<string> description: Ref<string>
@ -43,6 +45,7 @@ export function initData(route: Route): VitePressData {
return { return {
site, site,
theme: computed(() => site.value.themeConfig), theme: computed(() => site.value.themeConfig),
head: computed(() => site.value.head),
page: computed(() => route.data), page: computed(() => route.data),
frontmatter: computed(() => route.data.frontmatter), frontmatter: computed(() => route.data.frontmatter),
lang: computed(() => site.value.lang), lang: computed(() => site.value.lang),

@ -1,8 +1,7 @@
import path from 'path' import path from 'path'
import fs from 'fs-extra' import fs from 'fs-extra'
import { SiteConfig, resolveSiteDataByRoute } from '../config' import { SiteConfig, resolveSiteDataByRoute } from '../config'
import { HeadConfig } from '../shared' import { HeadConfig, processHead } from '../shared'
import { processHead } from '../../shared/shared'
import { normalizePath, transformWithEsbuild } from 'vite' import { normalizePath, transformWithEsbuild } from 'vite'
import { RollupOutput, OutputChunk, OutputAsset } from 'rollup' import { RollupOutput, OutputChunk, OutputAsset } from 'rollup'
import { slash } from '../utils/slash' import { slash } from '../utils/slash'
@ -130,7 +129,7 @@ export async function renderPage(
${stylesheetLink} ${stylesheetLink}
${preloadLinksString} ${preloadLinksString}
${prefetchLinkString} ${prefetchLinkString}
${await renderHead([...head, ...pageData.head])} ${await renderHead(head)}
</head> </head>
<body> <body>
<div id="app">${content}</div> <div id="app">${content}</div>

@ -7,6 +7,7 @@ export * from './markdown/markdown'
// shared types // shared types
export type { export type {
SiteData, SiteData,
PageData,
HeadConfig, HeadConfig,
Header, Header,
LocaleConfig, LocaleConfig,

@ -108,5 +108,6 @@ export function processHead(
head: HeadConfig[] | ((pageData: PageData) => HeadConfig[]), head: HeadConfig[] | ((pageData: PageData) => HeadConfig[]),
pageData: PageData pageData: PageData
): HeadConfig[] { ): HeadConfig[] {
return !head ? [] : typeof head === 'function' ? head(pageData) : head const combineHead = !head ? [] : typeof head === 'function' ? head(pageData) : head
return [...combineHead];
} }

Loading…
Cancel
Save