lessquo Posts - Answer Overflow

lessquo

Explore posts from servers

CDCloudflare Developers TPToss payments 개발자 커뮤니티 HHono

•Created by lessquo on 6/20/2024 in #help

How to use custom fetch method for Hono client?

I have a noob question. I used to use the axios library and want a similar experience with the Hono client, such as shorter syntax, automatic JSON transformation and interceptors. Some suggest using ky instead of axios, but I don't know how to integrate it. The documentation (https://hono.dev/docs/guides/rpc#custom-fetch-method) is unclear to me. Could I get any guidance or example code?

6 replies

HHono

•Created by lessquo on 5/19/2024 in #help

ContextVariableMap not recognized during build from other package in monorepo

I created src/hodo.d.ts file in my Hono project:

import { User } from './schema';

declare module 'hono' {
  interface ContextVariableMap {
    me: User;
  }
}

import { User } from './schema';

declare module 'hono' {
  interface ContextVariableMap {
    me: User;
  }
}

Then, the type was inferred out of the box:

import { Hono } from 'hono';

export const users = new Hono().get('/me', c => c.json(c.var.me));

import { Hono } from 'hono';

export const users = new Hono().get('/me', c => c.json(c.var.me));

And, I configured the RPC feature in my React project:

import { ApiType } from 'api/src';
import { hc } from 'hono/client';
import { getIdToken } from './firebase';

export const api = hc<ApiType>(import.meta.env.VITE_API_URL, {
  headers: async () => ({ Authorization: `Bearer ${await getIdToken()}` }),
});

import { ApiType } from 'api/src';
import { hc } from 'hono/client';
import { getIdToken } from './firebase';

export const api = hc<ApiType>(import.meta.env.VITE_API_URL, {
  headers: async () => ({ Authorization: `Bearer ${await getIdToken()}` }),
});

It worked like a charm. but then I tried build command and encountered an error:

$ tsc && vite build --mode dev
../api/src/routes/users.ts:3:56 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(object: JSONValue | {}, status?: StatusCode | undefined, headers?: HeaderRecord | undefined): Response & TypedResponse<never, StatusCode, "json">', gave the following error.
    Argument of type 'unknown' is not assignable to parameter of type 'JSONValue | {}'.
  Overload 2 of 2, '(object: JSONValue | {}, init?: ResponseInit | undefined): Response & TypedResponse<never, StatusCode, "json">', gave the following error.
    Argument of type 'unknown' is not assignable to parameter of type 'JSONValue | {}'.

3 export const users = new Hono().get('/me', c => c.json(c.var.me));

$ tsc && vite build --mode dev
../api/src/routes/users.ts:3:56 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(object: JSONValue | {}, status?: StatusCode | undefined, headers?: HeaderRecord | undefined): Response & TypedResponse<never, StatusCode, "json">', gave the following error.
    Argument of type 'unknown' is not assignable to parameter of type 'JSONValue | {}'.
  Overload 2 of 2, '(object: JSONValue | {}, init?: ResponseInit | undefined): Response & TypedResponse<never, StatusCode, "json">', gave the following error.
    Argument of type 'unknown' is not assignable to parameter of type 'JSONValue | {}'.

3 export const users = new Hono().get('/me', c => c.json(c.var.me));

Does ContextVariableMap type declaration not work with RPC feature?

35 replies

Gaming

Programming