feat(nprogress): introducing nprogress loading bar feature to vitepress

This commit is contained in:
andatoshiki 2023-03-24 16:59:59 +08:00
parent 311295ed59
commit 822e8a90a7

View File

@ -7,6 +7,8 @@ import { useData } from 'vitepress'
import Theme from 'vitepress/theme' import Theme from 'vitepress/theme'
import DefaultTheme from 'vitepress/theme' import DefaultTheme from 'vitepress/theme'
import mediumZoom from 'medium-zoom' import mediumZoom from 'medium-zoom'
import vitepressNprogress from '@andatoshiki/vitepress-plugin-nprogress'
import '@andatoshiki/vitepress-plugin-nprogress/lib/css/index.css'
// custom styles import // custom styles import
import './styles/index.scss' import './styles/index.scss'
@ -18,6 +20,9 @@ import CustomLayout from './CustomLayout.vue'
import AsideSponsors from './components/AsideSponsors.vue' import AsideSponsors from './components/AsideSponsors.vue'
// @ts-ignore // @ts-ignore
import Copyright from './components/Copyright.vue' import Copyright from './components/Copyright.vue'
// @ts-ignore
// import LinkPreview from './components/CardLink.vue'
import CardLink from './components/CardLink.vue'
if (typeof window !== 'undefined') { if (typeof window !== 'undefined') {
// unregister PWA service // unregister PWA service
@ -65,13 +70,20 @@ export default {
// medium zoom custom markdown attributes components // medium zoom custom markdown attributes components
setup() { setup() {
onMounted(() => { onMounted(() => {
mediumZoom('[data-zoomable]', { // medium zoom for images manually added with data-zoomable attribute
background: 'var(--vp-c-bg)', // mediumZoom('[data-zoomable]', {
scrollOffset: 40, // background: 'var(--vp-c-bg)',
}) // scrollOffset: 40,
// })
mediumZoom('.main img', { background: 'var(--vp-c-bg)' }) // register global component to make image zoom globally with the class
}) })
}, },
// enhanceApp({ app }: { app: App }) {
// app.provide('DEV', process.env.NODE_ENV === 'development') enhanceApp(ctx) {
// }, // custom component tag/slot
ctx.app.component('Link', CardLink)
// external plugin for vitepress hack performance
vitepressNprogress(ctx) // nprogress plugin for vitepress
},
} }