hmr for app dev

lib/app/composables/data.js

@@ -1,11 +0,0 @@
-export function useSiteData() {
-  return {
-    msg: 'this is site'
-  }
-}
-
-export function usePageData() {
-  return {
-    msg: 'this is page'
-  }
-}

lib/app/composables/pageData.js

@@ -0,0 +1,5 @@
+export function usePageData() {
+  return {
+    msg: 'this is page'
+  }
+}

lib/app/composables/siteData.js

@@ -0,0 +1,5 @@
+export function useSiteData() {
+  return {
+    msg: 'this is site'
+  }
+}

lib/app/exports.js

@@ -1,3 +1,4 @@
 // exports in this file are exposed to themes and md files via 'vitepress'
 // so the user can do `import { usePageData } from 'vitepress'`
-export { usePageData, useSiteData } from './composables/data'
+export { useSiteData } from './composables/siteData'
+export { usePageData } from './composables/pageData'

lib/app/index.js

@@ -1,7 +1,7 @@
 import { createApp, h } from 'vue'
 import { Content } from './components/Content'
 import { useRouter } from './composables/router'
-import { useSiteData } from './composables/data'
+import { useSiteData } from './composables/siteData'
 import Theme from '/@theme/index'
 
 const App = {

src/server.ts

@@ -19,6 +19,11 @@ function createVitePressPlugin({
   return ({ app, root, watcher, resolver }) => {
     const markdownToVue = createMarkdownToVueRenderFn(root)
 
+    // watch vitepress container app (only when developing vitepress itself)
+    if (process.env.VITEPRESS_DEV) {
+      watcher.add(APP_PATH)
+    }
+
     // watch theme files if it's outside of project root
     if (path.relative(root, themePath).startsWith('..')) {
       debugHmr(`watching theme dir outside of project root: ${themePath}`)