fix: revert #7463 and #6624 (#7522)

vitejs · Mar 30, 2022 · 8efc6a6 · 8efc6a6
1 parent 4fda42f
commit 8efc6a6
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 25 deletions.
diff --git a/packages/vite/src/client/client.ts b/packages/vite/src/client/client.ts
@@ -7,10 +7,9 @@ import '@vite/env'
 
 // injected by the hmr plugin when served
 declare const __BASE__: string
-declare const __HMR_PROTOCOL__: string | null
-declare const __HMR_HOSTNAME__: string | null
-declare const __HMR_PORT__: string | null
-declare const __HMR_BASE__: string
+declare const __HMR_PROTOCOL__: string
+declare const __HMR_HOSTNAME__: string
+declare const __HMR_PORT__: string
 declare const __HMR_TIMEOUT__: number
 declare const __HMR_ENABLE_OVERLAY__: boolean
 
@@ -19,10 +18,7 @@ console.log('[vite] connecting...')
 // use server configuration, then fallback to inference
 const socketProtocol =
   __HMR_PROTOCOL__ || (location.protocol === 'https:' ? 'wss' : 'ws')
-const socketHost = `${__HMR_HOSTNAME__ || location.hostname}:${
-  __HMR_PORT__ || location.port
-}${__HMR_BASE__}`
-
+const socketHost = `${__HMR_HOSTNAME__ || location.hostname}:${__HMR_PORT__}`
 const socket = new WebSocket(`${socketProtocol}://${socketHost}`, 'vite-hmr')
 const base = __BASE__ || '/'
 const messageBuffer: string[] = []

diff --git a/packages/vite/src/node/plugins/clientInjections.ts b/packages/vite/src/node/plugins/clientInjections.ts
@@ -2,7 +2,7 @@ import path from 'path'
 import type { Plugin } from '../plugin'
 import type { ResolvedConfig } from '../config'
 import { CLIENT_ENTRY, ENV_ENTRY } from '../constants'
-import { normalizePath } from '../utils'
+import { normalizePath, isObject } from '../utils'
 
 // ids in transform are normalized to unix style
 const normalizedClientEntry = normalizePath(CLIENT_ENTRY)
@@ -23,31 +23,32 @@ export function clientInjectionsPlugin(config: ResolvedConfig): Plugin {
         const protocol = options.protocol || null
         const timeout = options.timeout || 30000
         const overlay = options.overlay !== false
-        let port: number | string | undefined | null
-        port = options.clientPort || options.port
+        let port: number | string | undefined
+        if (isObject(config.server.hmr)) {
+          port = config.server.hmr.clientPort || config.server.hmr.port
+        }
         if (config.server.middlewareMode) {
-          port = port || 24678
+          port = String(port || 24678)
+        } else {
+          port = String(port || options.port || config.server.port!)
         }
-        port = port ? String(port) : null
-
         let hmrBase = config.base
         if (options.path) {
           hmrBase = path.posix.join(hmrBase, options.path)
         }
-        if (hmrBase === '/') {
-          hmrBase = ''
+        if (hmrBase !== '/') {
+          port = path.posix.normalize(`${port}${hmrBase}`)
         }
 
         return code
-          .replace(/__MODE__/g, JSON.stringify(config.mode))
-          .replace(/__BASE__/g, JSON.stringify(config.base))
-          .replace(/__DEFINES__/g, serializeDefine(config.define || {}))
-          .replace(/__HMR_PROTOCOL__/g, JSON.stringify(protocol))
-          .replace(/__HMR_HOSTNAME__/g, JSON.stringify(host))
-          .replace(/__HMR_PORT__/g, JSON.stringify(port))
-          .replace(/__HMR_BASE__/g, JSON.stringify(hmrBase))
-          .replace(/__HMR_TIMEOUT__/g, JSON.stringify(timeout))
-          .replace(/__HMR_ENABLE_OVERLAY__/g, JSON.stringify(overlay))
+          .replace(`__MODE__`, JSON.stringify(config.mode))
+          .replace(`__BASE__`, JSON.stringify(config.base))
+          .replace(`__DEFINES__`, serializeDefine(config.define || {}))
+          .replace(`__HMR_PROTOCOL__`, JSON.stringify(protocol))
+          .replace(`__HMR_HOSTNAME__`, JSON.stringify(host))
+          .replace(`__HMR_PORT__`, JSON.stringify(port))
+          .replace(`__HMR_TIMEOUT__`, JSON.stringify(timeout))
+          .replace(`__HMR_ENABLE_OVERLAY__`, JSON.stringify(overlay))
       } else if (!options?.ssr && code.includes('process.env.NODE_ENV')) {
         // replace process.env.NODE_ENV instead of defining a global
         // for it to avoid shimming a `process` object during dev,