solid-trpc v0.0.9

SolidJS tRPC - v10

Getting Started

I recommend using Create JD App but if you want to create a project from scratch, you can follow the steps below:

Installation

npm install solid-trpc@next @tanstack/solid-query

Creating A Client

// utils/trpc.ts
import { IAppRouter } from "@/routers"; // your router type
import { createTRPCSolid } from "solid-trpc";
import { httpBatchLink } from "@trpc/client";

export const trpc = createTRPCSolid<IAppRouter>();
export const client = trpc.createClient({
  links: [
    httpBatchLink({
      url: "/api/trpc",
    }),
  ],
});

TRPC Provider

// App.tsx
import { QueryClient } from "@tanstack/solid-query";
import { Component } from "solid-js";
import { TRPCProvider } from "solid-trpc";
import { client } from "./utils/trpc"; // the client we created above
import Home from "./pages/Home"; // any page that uses trpc

interface IAppProps {}

const queryClient = new QueryClient();
const App: Component<IAppProps> = ({}) => {
  return (
    <TRPCProvider client={client} queryClient={queryClient}>
      <Home />
    </TRPCProvider>
  );
};

export default App;