feat: skip unused json watch apply

src/node/server/serverPluginHmr.ts

@@ -183,6 +183,7 @@ export const hmrPlugin: ServerPlugin = ({
   watcher.on('change', (file) => {
     if (
       !(
+        file.endsWith('.json') ||
         file.endsWith('.vue') ||
         file.endsWith('.css') ||
         cssPreprocessLangRE.test(file)

src/node/server/serverPluginJson.ts

@@ -1,14 +1,30 @@
 import { ServerPlugin } from '.'
 import { readBody, isImportRequest } from '../utils'
 
-export const jsonPlugin: ServerPlugin = ({ app }) => {
+const usedJsonSet = new Set<string>()
+
+export const jsonPlugin: ServerPlugin = ({ app, resolver, watcher }) => {
   app.use(async (ctx, next) => {
     await next()
     // handle .json imports
     // note ctx.body could be null if upstream set status to 304
-    if (ctx.path.endsWith('.json') && isImportRequest(ctx) && ctx.body) {
-      ctx.type = 'js'
-      ctx.body = `export default ${await readBody(ctx.body)}`
+    if (ctx.path.endsWith('.json')) {
+      if (isImportRequest(ctx) && ctx.body) {
+        ctx.type = 'js'
+        ctx.body = `export default ${await readBody(ctx.body)}`
+      }
+      usedJsonSet.add(ctx.path)
+    }
+  })
+
+  watcher.on('change', (filePath) => {
+    if (filePath.endsWith('.json')) {
+      const publicPath = resolver.fileToRequest(filePath)
+
+      // skip unused
+      if (!usedJsonSet.has(publicPath)) return
+
+      watcher.handleJSReload(filePath)
     }
   })
 }