fix: websockets are no longer created when server.hmr is false (v…

…itejs#13994)
MarryDream · Jul 31, 2023 · ab5da60 · ab5da60
1 parent 4ca7c13
commit ab5da60
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 32 deletions.
diff --git a/packages/vite/src/client/client.ts b/packages/vite/src/client/client.ts
@@ -7,6 +7,7 @@ import '@vite/env'
 // injected by the hmr plugin when served
 declare const __BASE__: string
 declare const __SERVER_HOST__: string
+declare const __HMR_ENABLE__: string
 declare const __HMR_PROTOCOL__: string | null
 declare const __HMR_HOSTNAME__: string | null
 declare const __HMR_PORT__: number | null
@@ -21,6 +22,7 @@ const importMetaUrl = new URL(import.meta.url)
 
 // use server configuration, then fallback to inference
 const serverHost = __SERVER_HOST__
+const serverEnable = __HMR_ENABLE__
 const socketProtocol =
   __HMR_PROTOCOL__ || (importMetaUrl.protocol === 'https:' ? 'wss' : 'ws')
 const hmrPort = __HMR_PORT__
@@ -32,41 +34,43 @@ const base = __BASE__ || '/'
 const messageBuffer: string[] = []
 
 let socket: WebSocket
-try {
-  let fallback: (() => void) | undefined
-  // only use fallback when port is inferred to prevent confusion
-  if (!hmrPort) {
-    fallback = () => {
-      // fallback to connecting directly to the hmr server
-      // for servers which does not support proxying websocket
-      socket = setupWebSocket(socketProtocol, directSocketHost, () => {
-        const currentScriptHostURL = new URL(import.meta.url)
-        const currentScriptHost =
-          currentScriptHostURL.host +
-          currentScriptHostURL.pathname.replace(/@vite\/client$/, '')
-        console.error(
-          '[vite] failed to connect to websocket.\n' +
-            'your current setup:\n' +
-            `  (browser) ${currentScriptHost} <--[HTTP]--> ${serverHost} (server)\n` +
-            `  (browser) ${socketHost} <--[WebSocket (failing)]--> ${directSocketHost} (server)\n` +
-            'Check out your Vite / network configuration and https://vitejs.dev/config/server-options.html#server-hmr .',
-        )
-      })
-      socket.addEventListener(
-        'open',
-        () => {
-          console.info(
-            '[vite] Direct websocket connection fallback. Check out https://vitejs.dev/config/server-options.html#server-hmr to remove the previous connection error.',
+if (serverEnable) {
+  try {
+    let fallback: (() => void) | undefined
+    // only use fallback when port is inferred to prevent confusion
+    if (!hmrPort) {
+      fallback = () => {
+        // fallback to connecting directly to the hmr server
+        // for servers which does not support proxying websocket
+        socket = setupWebSocket(socketProtocol, directSocketHost, () => {
+          const currentScriptHostURL = new URL(import.meta.url)
+          const currentScriptHost =
+            currentScriptHostURL.host +
+            currentScriptHostURL.pathname.replace(/@vite\/client$/, '')
+          console.error(
+            '[vite] failed to connect to websocket.\n' +
+              'your current setup:\n' +
+              `  (browser) ${currentScriptHost} <--[HTTP]--> ${serverHost} (server)\n` +
+              `  (browser) ${socketHost} <--[WebSocket (failing)]--> ${directSocketHost} (server)\n` +
+              'Check out your Vite / network configuration and https://vitejs.dev/config/server-options.html#server-hmr .',
           )
-        },
-        { once: true },
-      )
+        })
+        socket.addEventListener(
+          'open',
+          () => {
+            console.info(
+              '[vite] Direct websocket connection fallback. Check out https://vitejs.dev/config/server-options.html#server-hmr to remove the previous connection error.',
+            )
+          },
+          { once: true },
+        )
+      }
     }
-  }
 
-  socket = setupWebSocket(socketProtocol, socketHost, fallback)
-} catch (error) {
-  console.error(`[vite] failed to connect to websocket (${error}). `)
+    socket = setupWebSocket(socketProtocol, socketHost, fallback)
+  } catch (error) {
+    console.error(`[vite] failed to connect to websocket (${error}). `)
+  }
 }
 
 function setupWebSocket(

diff --git a/packages/vite/src/node/plugins/clientInjections.ts b/packages/vite/src/node/plugins/clientInjections.ts
@@ -29,6 +29,7 @@ export function clientInjectionsPlugin(config: ResolvedConfig): Plugin {
       const serverHost = `${resolvedServerHostname}:${resolvedServerPort}${devBase}`
 
       let hmrConfig = config.server.hmr
+      const hmrEnable = hmrConfig !== false
       hmrConfig = isObject(hmrConfig) ? hmrConfig : undefined
       const host = hmrConfig?.host || null
       const protocol = hmrConfig?.protocol || null
@@ -58,6 +59,7 @@ export function clientInjectionsPlugin(config: ResolvedConfig): Plugin {
       const baseReplacement = escapeReplacement(devBase)
       const definesReplacement = () => serializedDefines
       const serverHostReplacement = escapeReplacement(serverHost)
+      const hmrEnableReplacement = escapeReplacement(hmrEnable)
       const hmrProtocolReplacement = escapeReplacement(protocol)
       const hmrHostnameReplacement = escapeReplacement(host)
       const hmrPortReplacement = escapeReplacement(port)
@@ -72,6 +74,7 @@ export function clientInjectionsPlugin(config: ResolvedConfig): Plugin {
           .replace(/__BASE__/g, baseReplacement)
           .replace(`__DEFINES__`, definesReplacement)
           .replace(`__SERVER_HOST__`, serverHostReplacement)
+          .replace(`__HMR_ENABLE__`, hmrEnableReplacement)
           .replace(`__HMR_PROTOCOL__`, hmrProtocolReplacement)
           .replace(`__HMR_HOSTNAME__`, hmrHostnameReplacement)
           .replace(`__HMR_PORT__`, hmrPortReplacement)