whatisgithub

What is vite-dev-rpc?

antfu/vite-dev-rpc — explained in plain English

Analysis updated 2026-07-03 · repo last pushed 2026-05-01

75TypeScriptAudience · developerComplexity · 2/5MaintainedSetup · moderate

In one sentence

A small plugin that lets Vite plugins send messages back and forth between the browser and the local dev server during development, enabling interactive dev tools without a separate API.

Mindmap

mindmap
  root((repo))
    What it does
      Browser to server chat
      Server to browser push
      Two-way dev messaging
    Tech stack
      TypeScript
      Vite
      birpc
      vite-hot-client
    Use cases
      Custom dev overlays
      Trigger server actions
      Push live updates
    Audience
      Vite plugin authors
      Dev tooling builders
    Setup
      Thin layer library
      Sparse docs
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Build a Vite plugin with a custom dev overlay that triggers server-side actions like regenerating files.

USE CASE 2

Create a development panel that pushes live status updates from the server to the browser.

USE CASE 3

Add interactive debugging controls in the browser that communicate with the Vite dev server.

What is it built with?

TypeScriptVitebirpcvite-hot-client

How does it compare?

antfu/vite-dev-rpcredis/redis-for-vs-codesmjai/open-memory-protocol
Stars757666
LanguageTypeScriptTypeScriptTypeScript
Last pushed2026-05-012026-06-01
MaintenanceMaintainedMaintained
Setup difficultymoderateeasyeasy
Complexity2/52/53/5
Audiencedeveloperdeveloperdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · moderate Time to first run · 30min

The README has minimal usage docs, so you will need to read the source code or find examples to understand the API.

So what is it?

vite-dev-rpc lets developers building Vite plugins send messages back and forth between the browser and the dev server. In plain terms, it lets code running in your browser talk directly to code running on your local server, and vice versa, while you're developing a web app. Vite is a popular tool for building web applications, and plugins extend what it can do. Normally, the browser and the dev server don't have an easy way to chat with each other during development. This project fills that gap by providing a two-way communication channel. The browser can ask the server to do something, the server can respond, and the server can also push updates to the browser on its own. This would be useful for plugin authors who want to build interactive development tools. For example, if you're building a plugin that shows a custom overlay or panel in the browser during development, you might want that panel to trigger actions on the server, like regenerating a file or running a quick check. This package makes that kind of back-and-forth straightforward without needing to set up a separate API or WebSocket connection. The project is built on top of three things: birpc, which handles the two-way messaging, vite-hot-client, which taps into Vite's hot module replacement system at runtime, and a newer Vite API for server-client communication introduced in Vite 2.9. Because it relies on these existing pieces, it's a relatively thin layer rather than a full communication framework from scratch. The README doesn't go into much detail on usage or configuration, so you'd likely need to look at the source or examples to get started.

Copy-paste prompts

Prompt 1
Help me set up vite-dev-rpc in my Vite plugin so the browser can send a message to the dev server to trigger a file regeneration.
Prompt 2
Using vite-dev-rpc, write a Vite plugin that pushes a notification from the dev server to the browser when a build step finishes.
Prompt 3
Show me an example of using vite-dev-rpc to create a custom dev overlay panel where clicking a button runs a check on the server.
Prompt 4
Walk me through the vite-dev-rpc source code so I understand how birpc and vite-hot-client enable two-way messaging.

Frequently asked questions

What is vite-dev-rpc?

A small plugin that lets Vite plugins send messages back and forth between the browser and the local dev server during development, enabling interactive dev tools without a separate API.

What language is vite-dev-rpc written in?

Mainly TypeScript. The stack also includes TypeScript, Vite, birpc.

Is vite-dev-rpc actively maintained?

Maintained — commit in last 6 months (last push 2026-05-01).

How hard is vite-dev-rpc to set up?

Setup difficulty is rated moderate, with roughly 30min to a first successful run.

Who is vite-dev-rpc for?

Mainly developer.

Open on GitHub → Ask about another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.