feat: support json hmr

src/node/index.ts

@@ -1,3 +1,3 @@
 export * from './server'
 export * from './build'
-export * from './utils'
+export { readBody, cachedRead, isStaticAsset, isImportRequest } from './utils'

src/node/serverPluginJson.ts

@@ -1,7 +1,7 @@
 import { Plugin } from './server'
 import { readBody, isImportRequest } from './utils'
 
-export const jsonPlugin: Plugin = ({ app }) => {
+export const jsonPlugin: Plugin = ({ app, watcher }) => {
   app.use(async (ctx, next) => {
     await next()
     // handle .json imports
@@ -11,4 +11,10 @@ export const jsonPlugin: Plugin = ({ app }) => {
       ctx.body = `export default ${await readBody(ctx.body)}`
     }
   })
+
+  watcher.on('change', (file) => {
+    if (file.endsWith('.json')) {
+      watcher.handleJSReload(file)
+    }
+  })
 }

src/node/serverPluginModuleRewrite.ts

@@ -13,7 +13,7 @@ import {
   rewriteFileWithHMR,
   hmrClientPublicPath
 } from './serverPluginHmr'
-import { readBody } from './utils'
+import { readBody, cleanUrl, queryRE } from './utils'
 
 const debug = require('debug')('vite:rewrite')
 
@@ -87,17 +87,12 @@ export const moduleRewritePlugin: Plugin = ({ app, watcher, resolver }) => {
       !((ctx.path.endsWith('.vue') || ctx.vue) && ctx.query.type != null)
     ) {
       const content = await readBody(ctx.body)
-      if (rewriteCache.has(content)) {
+      if (!ctx.query.t && rewriteCache.has(content)) {
         debug(`${ctx.url}: serving from cache`)
         ctx.body = rewriteCache.get(content)
       } else {
         await initLexer
-        ctx.body = rewriteImports(
-          content!,
-          ctx.url.replace(/(&|\?)t=\d+/, ''),
-          resolver,
-          ctx.query.t
-        )
+        ctx.body = rewriteImports(content!, ctx.path, resolver, ctx.query.t)
         rewriteCache.set(content, ctx.body)
       }
     } else {
@@ -152,8 +147,7 @@ function rewriteImports(
               hasReplaced = true
             }
           } else {
-            const queryRE = /\?.*$/
-            let pathname = id.replace(queryRE, '')
+            let pathname = cleanUrl(id)
             const queryMatch = id.match(queryRE)
             let query = queryMatch ? queryMatch[0] : ''
             // append .js for extension-less imports
@@ -180,7 +174,9 @@ function rewriteImports(
           }
 
           // save the import chain for hmr analysis
-          const importee = slash(path.resolve(path.dirname(importer), resolved))
+          const importee = cleanUrl(
+            slash(path.resolve(path.dirname(importer), resolved))
+          )
           currentImportees.add(importee)
           debugHmr(`        ${importer} imports ${importee}`)
           ensureMapEntry(importerMap, importee).add(importer)

src/node/utils.ts

@@ -3,7 +3,6 @@ import { promises as fs } from 'fs'
 import LRUCache from 'lru-cache'
 import { Context } from 'koa'
 import { Readable } from 'stream'
-import { URL } from 'url'
 const getETag = require('etag')
 
 const imageRE = /\.(png|jpe?g|gif|svg)(\?.*)?$/
@@ -24,10 +23,16 @@ export const isStaticAsset = (file: string) => {
  * as well.
  */
 export const isImportRequest = (ctx: Context) => {
-  const referer = new URL(ctx.get('referer')).pathname
+  const referer = cleanUrl(ctx.get('referer'))
   return /\.\w+$/.test(referer) && !referer.endsWith('.html')
 }
 
+export const queryRE = /\?.*$/
+export const hashRE = /\#.*$/
+
+export const cleanUrl = (url: string) =>
+  url.replace(hashRE, '').replace(queryRE, '')
+
 interface CacheEntry {
   lastModified: number
   etag: string