mirror of https://github.com/vuejs/vitepress
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
82 lines
2.0 KiB
82 lines
2.0 KiB
import { createApp, h, readonly } from 'vue'
|
|
import { Content } from './components/Content'
|
|
import { initRouter } from './composables/router'
|
|
import { useSiteData } from './composables/siteData'
|
|
import { initPageData, usePageData } from './composables/pageData'
|
|
import Theme from '/@theme/index'
|
|
import { hot } from '@hmr'
|
|
|
|
const inBrowser = typeof window !== 'undefined'
|
|
|
|
const NotFound = Theme.NotFound || (() => '404 Not Found')
|
|
|
|
const App = {
|
|
setup() {
|
|
const pageDataRef = initPageData()
|
|
|
|
initRouter((route) => {
|
|
let pagePath = route.path.replace(/\.html$/, '')
|
|
if (pagePath.endsWith('/')) {
|
|
pagePath += 'index'
|
|
}
|
|
if (__DEV__) {
|
|
// awlays force re-fetch content in dev
|
|
pagePath += `.md?t=${Date.now()}`
|
|
} else {
|
|
// in production, each .md file is built into a .md.js file following
|
|
// the path conversion scheme.
|
|
// /foo/bar.html -> /js/foo_bar.md.js
|
|
// TODO handle base
|
|
pagePath = `/js/${pagePath.slice(1).replace(/\//g, '_')}.md.js`
|
|
}
|
|
|
|
if (inBrowser) {
|
|
// in browser: native dynamic import
|
|
return import(pagePath).then((m) => {
|
|
pageDataRef.value = readonly(m.__pageData)
|
|
return m.default
|
|
})
|
|
} else {
|
|
// SSR, sync require
|
|
return require(pagePath).default
|
|
}
|
|
}, NotFound)
|
|
|
|
if (__DEV__ && inBrowser) {
|
|
// hot reload pageData
|
|
hot.on('vitepress:pageData', (data) => {
|
|
if (
|
|
data.path.replace(/\.md$/, '') ===
|
|
location.pathname.replace(/\.html$/, '')
|
|
) {
|
|
pageDataRef.value = data.pageData
|
|
}
|
|
})
|
|
}
|
|
|
|
return () => h(Theme.Layout)
|
|
}
|
|
}
|
|
|
|
// TODO use createSSRApp in production
|
|
const app = createApp(App)
|
|
|
|
app.component('Content', Content)
|
|
|
|
app.mixin({
|
|
beforeCreate() {
|
|
const siteRef = useSiteData()
|
|
const pageRef = usePageData()
|
|
Object.defineProperties(this, {
|
|
$site: {
|
|
get: () => siteRef.value
|
|
},
|
|
$page: {
|
|
get: () => pageRef.value
|
|
}
|
|
})
|
|
}
|
|
})
|
|
|
|
app.mount('#app')
|