Hono•2w ago

Custom RPC

Hi, kindly ask for help. I want to have the RPC API type for frontend use. During dev, I facing an issue when do the api in frontend, as my custom apiRoute seems cant support it.

9 Replies

Arjix•2w ago

shcworkOP•2w ago

I did try

import { hc } from "hono/client";
import { auth } from "@server/routes/auth";

const client = hc<typeof auth>("/");
export const api = client.api;

import { hc } from "hono/client";
import { auth } from "@server/routes/auth";

const client = hc<typeof auth>("/");
export const api = client.api;

come out

Type 'Hono<Env, ToSchema<"post", "/register", any, any> & ToSchema<"post", "/login", any, any> & ToSchema<"post", "/forgotPassword", any, any> & ToSchema<...> & ToSchema<...> & ToSchema<...> & ToSchema<...>, "/">' does not satisfy the constraint 'Hono<any, any, any>'.
  Types of property 'get' are incompatible.
    Type 'HandlerInterface<Env, "get", ToSchema<"post", "/register", any, any> & ToSchema<"post", "/login", any, any> & ToSchema<"post", "/forgotPassword", any, any> & ToSchema<...> & ToSchema<...> & ToSchema<...> & ToSchema<...>, "/">' is not assignable to type 'HandlerInterface<any, "get", any, any>'.
      Types of parameters 'handler' and 'handler' are incompatible.
        Type 'import("/home/shchin/prj/bun_hono_react_template/frontend/node_modules/hono/dist/types/types").H<any, any, any, any>' is not assignable to type 'import("/home/shchin/prj/bun_hono_react_template/server/node_modules/hono/dist/types/types").H<any, any, any, any>'.
          Type 'Handler<any, any, any, any>' is not assignable to type 'H<any, any, any, any>'.
            Type 'import("/home/shchin/prj/bun_hono_react_template/frontend/node_modules/hono/dist/types/types").Handler<any, any, any, any>' is not assignable to type 'import("/home/shchin/prj/bun_hono_react_template/server/node_modules/hono/dist/types/types").Handler<any, any, any, any>'.
              Types of parameters 'c' and 'c' are incompatible.
                Type 'Context<any, any, any>' is missing the following properties from type 'Context<any, any, any>': setLayout, getLayoutts(2344)
(alias) const auth: Hono<Env, ToSchema<"post", "/register", any, any> & ToSchema<"post", "/login", any, any> & ToSchema<"post", "/forgotPassword", any, any> & ToSchema<...> & ToSchema<...> & ToSchema<...> & ToSchema<...>, "/">
import auth

Type 'Hono<Env, ToSchema<"post", "/register", any, any> & ToSchema<"post", "/login", any, any> & ToSchema<"post", "/forgotPassword", any, any> & ToSchema<...> & ToSchema<...> & ToSchema<...> & ToSchema<...>, "/">' does not satisfy the constraint 'Hono<any, any, any>'.
  Types of property 'get' are incompatible.
    Type 'HandlerInterface<Env, "get", ToSchema<"post", "/register", any, any> & ToSchema<"post", "/login", any, any> & ToSchema<"post", "/forgotPassword", any, any> & ToSchema<...> & ToSchema<...> & ToSchema<...> & ToSchema<...>, "/">' is not assignable to type 'HandlerInterface<any, "get", any, any>'.
      Types of parameters 'handler' and 'handler' are incompatible.
        Type 'import("/home/shchin/prj/bun_hono_react_template/frontend/node_modules/hono/dist/types/types").H<any, any, any, any>' is not assignable to type 'import("/home/shchin/prj/bun_hono_react_template/server/node_modules/hono/dist/types/types").H<any, any, any, any>'.
          Type 'Handler<any, any, any, any>' is not assignable to type 'H<any, any, any, any>'.
            Type 'import("/home/shchin/prj/bun_hono_react_template/frontend/node_modules/hono/dist/types/types").Handler<any, any, any, any>' is not assignable to type 'import("/home/shchin/prj/bun_hono_react_template/server/node_modules/hono/dist/types/types").Handler<any, any, any, any>'.
              Types of parameters 'c' and 'c' are incompatible.
                Type 'Context<any, any, any>' is missing the following properties from type 'Context<any, any, any>': setLayout, getLayoutts(2344)
(alias) const auth: Hono<Env, ToSchema<"post", "/register", any, any> & ToSchema<"post", "/login", any, any> & ToSchema<"post", "/forgotPassword", any, any> & ToSchema<...> & ToSchema<...> & ToSchema<...> & ToSchema<...>, "/">
import auth

Arjix•2w ago

Are you in a monorepo? If so, are you sure you are using the same hono version on both backend and frontend If not, then what the fuck is going on, this doesn't make sense Also, please export the type from the backend, don't do typeof auth from the frontend Instead do export type AUTH = typeof auth; and then import type { AUTH } from "backend..."; and use that type

shcworkOP•2w ago

Yes, I use monorepo. Yes, both using [email protected]. Will try on that method

shcworkOP•2w ago

Type 'Hono<Env, ToSchema<"post", "/register", any, any> & ToSchema<"post", "/login", any, any> & ToSchema<"post", "/forgotPassword", any, any> & ToSchema<...> & ToSchema<...> & ToSchema<...> & ToSchema<...>, "/">' does not satisfy the constraint 'Hono<any, any, any>'.
  Types of property 'get' are incompatible.
    Type 'HandlerInterface<Env, "get", ToSchema<"post", "/register", any, any> & ToSchema<"post", "/login", any, any> & ToSchema<"post", "/forgotPassword", any, any> & ToSchema<...> & ToSchema<...> & ToSchema<...> & ToSchema<...>, "/">' is not assignable to type 'HandlerInterface<any, "get", any, any>'.
      Types of parameters 'handler' and 'handler' are incompatible.
        Type 'import("/home/shchin/prj/bun_hono_react_template/frontend/node_modules/hono/dist/types/types").H<any, any, any, any>' is not assignable to type 'import("/home/shchin/prj/bun_hono_react_template/server/node_modules/hono/dist/types/types").H<any, any, any, any>'.
          Type 'Handler<any, any, any, any>' is not assignable to type 'H<any, any, any, any>'.
            Type 'import("/home/shchin/prj/bun_hono_react_template/frontend/node_modules/hono/dist/types/types").Handler<any, any, any, any>' is not assignable to type 'import("/home/shchin/prj/bun_hono_react_template/server/node_modules/hono/dist/types/types").Handler<any, any, any, any>'.
              Types of parameters 'c' and 'c' are incompatible.
                Type 'Context<any, any, any>' is missing the following properties from type 'Context<any, any, any>': setLayout, getLayoutts(2344)
(alias) type AUTH = Hono<Env, ToSchema<"post", "/register", any, any> & ToSchema<"post", "/login", any, any> & ToSchema<"post", "/forgotPassword", any, any> & ToSchema<...> & ToSchema<...> & ToSchema<...> & ToSchema<...>, "/">
import AUTH

Type 'Hono<Env, ToSchema<"post", "/register", any, any> & ToSchema<"post", "/login", any, any> & ToSchema<"post", "/forgotPassword", any, any> & ToSchema<...> & ToSchema<...> & ToSchema<...> & ToSchema<...>, "/">' does not satisfy the constraint 'Hono<any, any, any>'.
  Types of property 'get' are incompatible.
    Type 'HandlerInterface<Env, "get", ToSchema<"post", "/register", any, any> & ToSchema<"post", "/login", any, any> & ToSchema<"post", "/forgotPassword", any, any> & ToSchema<...> & ToSchema<...> & ToSchema<...> & ToSchema<...>, "/">' is not assignable to type 'HandlerInterface<any, "get", any, any>'.
      Types of parameters 'handler' and 'handler' are incompatible.
        Type 'import("/home/shchin/prj/bun_hono_react_template/frontend/node_modules/hono/dist/types/types").H<any, any, any, any>' is not assignable to type 'import("/home/shchin/prj/bun_hono_react_template/server/node_modules/hono/dist/types/types").H<any, any, any, any>'.
          Type 'Handler<any, any, any, any>' is not assignable to type 'H<any, any, any, any>'.
            Type 'import("/home/shchin/prj/bun_hono_react_template/frontend/node_modules/hono/dist/types/types").Handler<any, any, any, any>' is not assignable to type 'import("/home/shchin/prj/bun_hono_react_template/server/node_modules/hono/dist/types/types").Handler<any, any, any, any>'.
              Types of parameters 'c' and 'c' are incompatible.
                Type 'Context<any, any, any>' is missing the following properties from type 'Context<any, any, any>': setLayout, getLayoutts(2344)
(alias) type AUTH = Hono<Env, ToSchema<"post", "/register", any, any> & ToSchema<"post", "/login", any, any> & ToSchema<"post", "/forgotPassword", any, any> & ToSchema<...> & ToSchema<...> & ToSchema<...> & ToSchema<...>, "/">
import AUTH

still appear this error 😅

ambergristle•2w ago

@shcwork using generated instead of inferred types may help, but that's usually for type elision you're doing a lot of abstraction, which is increasing your app's complexity in a way that could be contributing to your issue i'm pretty sure your implementation of apiRouters is incompatible with hono RPC, for example why are you iteratively registering routes?

shcworkOP•2w ago

My intention is to make the route api as file base (/api/auth, /api/expenses) without user define every single route app.route('/auth', auth) app.route('/expenses', expenses) ... If my implementation fail, I will back to the hono ori method.

ambergristle•2w ago

typescript can't infer from an iteration like that so hono RPC won't work defining each route explicitly is also more transparent + easier to reason with. iteratively registering routes is almost never a good idea, imo

shcworkOP•2w ago

Ic, I wil give up my method and adapt the hono ori method, thx for explaination.

Gaming

Programming

Custom RPC

Did you find this page helpful?