fix: update logic that is resolve socket url (#188)

* Update logic that is resolve socket url

* Update logic that is resolve socket url

* Update logic that is resolve socket url

Author: soilSpoon

.eslintrc.js

@@ -7,6 +7,7 @@ module.exports = {
     __HMR_HOSTNAME__: 'readonly',
     __HMR_PORT__: 'readonly',
     __HMR_PROTOCOL__: 'readonly',
+    __HMR_BASE__: 'readonly',
     __dirname: 'off',
     __filename: 'off',
   },

packages/runtime/src/ws.js

@@ -1,10 +1,13 @@
 // #region
-// copied from https://github.dev/vitejs/vite/blob/76bbcd09985f85f7786b7e2e2d5ce177ee7d1916/packages/vite/src/client/client.ts#L25
+// copied from https://github.com/vitejs/vite/blob/d76db0cae645beaecd970d95b4819158c5dd568a/packages/vite/src/client/client.ts#LL25
 // use server configuration, then fallback to inference
+const importMetaUrl = new URL(import.meta.url)
+
 const socketProtocol = __HMR_PROTOCOL__ || (location.protocol === 'https:' ? 'wss' : 'ws')
-const socketHost = __HMR_PORT__
-  ? `${__HMR_HOSTNAME__ || location.hostname}:${__HMR_PORT__}`
-  : `${__HMR_HOSTNAME__ || location.hostname}`
+const hmrPort = __HMR_PORT__
+const socketHost = `${__HMR_HOSTNAME__ || importMetaUrl.hostname}:${
+  hmrPort || importMetaUrl.port
+}${__HMR_BASE__}`
 const socket = new WebSocket(`${socketProtocol}://${socketHost}`, 'vite-hmr')
 // #endregion
 

packages/vite-plugin-checker/src/main.ts

@@ -107,38 +107,34 @@ export function checker(userConfig: UserPluginConfig): Plugin {
 
       return
     },
-    transform(code, id) {
+    transform(code, id, options) {
       if (id === RUNTIME_PUBLIC_PATH) {
         if (!resolvedConfig) return
 
+        const devBase = resolvedConfig.base
+
         // #region
-        // copied from https://github.dev/vitejs/vite/blob/76bbcd09985f85f7786b7e2e2d5ce177ee7d1916/packages/vite/src/client/client.ts#L25
-        let options = resolvedConfig.server.hmr
-        options = options && typeof options !== 'boolean' ? options : {}
-        const host = options.host || null
-        const protocol = options.protocol || null
-        let port: number | string | false | undefined
-        if (isObject(resolvedConfig.server.hmr)) {
-          port = resolvedConfig.server.hmr.clientPort || resolvedConfig.server.hmr.port
-        }
+        // copied from https://github.com/vitejs/vite/blob/d76db0cae645beaecd970d95b4819158c5dd568a/packages/vite/src/client/client.ts#LL25
+        const hmrConfig = isObject(resolvedConfig.server.hmr) ? resolvedConfig.server.hmr : {}
+        const host = hmrConfig.host || null
+        const protocol = hmrConfig.protocol || null
+        // hmr.clientPort -> hmr.port
+        // -> (24678 if middleware mode) -> new URL(import.meta.url).port
+        let port = hmrConfig?.clientPort || hmrConfig?.port || null
         if (resolvedConfig.server.middlewareMode) {
-          port = String(port || 24678)
-        } else {
-          port = String(port || options.port || resolvedConfig.server.port!)
+          port ||= 24678
         }
 
-        let hmrBase = resolvedConfig.base
-        if (options.path) {
-          hmrBase = path.posix.join(hmrBase, options.path)
-        }
-        if (hmrBase !== '/') {
-          port = path.posix.normalize(`${port}${hmrBase}`)
+        let hmrBase = devBase
+        if (hmrConfig?.path) {
+          hmrBase = path.posix.join(hmrBase, hmrConfig.path)
         }
 
         return code
           .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))
         // #endregion
       }