createWebSocketModuleRunnerTransport() — vite Function Reference

Architecture documentation for the createWebSocketModuleRunnerTransport() function in moduleRunnerTransport.ts from the vite codebase.

Function typescript HMRClient WebSocketTransport called by 1

Entity Profile

HMRClient→ WebSocketTransport→ createWebSocketModuleRunnerTransport() — vite Function Reference

Dependency Diagram

graph TD
  0dc29000_7d3b_f918_1785_133ec8e42b03["createWebSocketModuleRunnerTransport()"]
  a469d907_868c_e1c2_3f7a_7aaf42cc6a7a["moduleRunnerTransport.ts"]
  0dc29000_7d3b_f918_1785_133ec8e42b03 -->|defined in| a469d907_868c_e1c2_3f7a_7aaf42cc6a7a
  7dcdb86c_d822_bbd2_a092_4494c22c6bea["transport()"]
  7dcdb86c_d822_bbd2_a092_4494c22c6bea -->|calls| 0dc29000_7d3b_f918_1785_133ec8e42b03
  style 0dc29000_7d3b_f918_1785_133ec8e42b03 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/vite/src/shared/moduleRunnerTransport.ts lines 258–327

export const createWebSocketModuleRunnerTransport = (options: {
  // eslint-disable-next-line n/no-unsupported-features/node-builtins
  createConnection: () => WebSocket
  pingInterval?: number
}): Required<
  Pick<ModuleRunnerTransport, 'connect' | 'disconnect' | 'send'>
> => {
  const pingInterval = options.pingInterval ?? 30000

  // eslint-disable-next-line n/no-unsupported-features/node-builtins
  let ws: WebSocket | undefined
  let pingIntervalId: ReturnType<typeof setInterval> | undefined
  return {
    async connect({ onMessage, onDisconnection }) {
      const socket = options.createConnection()
      socket.addEventListener('message', async ({ data }) => {
        onMessage(JSON.parse(data))
      })

      let isOpened = socket.readyState === socket.OPEN
      if (!isOpened) {
        await new Promise<void>((resolve, reject) => {
          socket.addEventListener(
            'open',
            () => {
              isOpened = true
              resolve()
            },
            { once: true },
          )
          socket.addEventListener('close', async () => {
            if (!isOpened) {
              reject(new Error('WebSocket closed without opened.'))
              return
            }

            onMessage({
              type: 'custom',
              event: 'vite:ws:disconnect',
              data: { webSocket: socket },
            })
            onDisconnection()
          })
        })
      }

      onMessage({
        type: 'custom',
        event: 'vite:ws:connect',
        data: { webSocket: socket },
      })
      ws = socket

      // proxy(nginx, docker) hmr ws maybe caused timeout,
      // so send ping package let ws keep alive.
      pingIntervalId = setInterval(() => {
        if (socket.readyState === socket.OPEN) {
          socket.send(JSON.stringify({ type: 'ping' }))
        }
      }, pingInterval)
    },
    disconnect() {
      clearInterval(pingIntervalId)
      ws?.close()
    },
    send(data) {
      ws!.send(JSON.stringify(data))
    },
  }
}