Install

Install pRPC

Installation

pnpm install @solid-mediakit/prpc @tanstack/solid-query @solid-mediakit/prpc-plugin

Adding The Vite Plugin

Go ahead to app.config.ts and add the following:

import { defineConfig } from '@solidjs/start/config'
import { prpcVite } from '@solid-mediakit/prpc-plugin' // ->

export default defineConfig({
  ssr: true,
  vite: {
    plugins: [prpcVite({ log: false })], // ->
  },
})

Basically, what is going to happen is that the Vite plugin will make this piece of code run on the server, causing it so Zod doesn’t leak to the client nor any other server-side code. What’s so special about it is that it includes many useful features which aren’t build in Vinxi, like Zod validation, event$ property, custom error handling and more. The transformation process is done via Babel at real time so you don’t have to worry about having ugly code in your code base, you just write it and we are in charge of the ‘behind the scenes’ stuff.

Now you can start using pRPC in your project.

• query$
• mutation$
• builder$