DEV Community

mohammad garmabi
mohammad garmabi

Posted on

Migrate axios / ky / ofetch / fetch tanstack-fetch (CLI for TanStack Query)

#javascript #react #typescript #tools

If you use TanStack Query, your queryFn wants: return data, throw on error, honor AbortSignal.

tanstack-fetch 1.6.2 ships a migrate CLI: scan axios / ky / ofetch / raw fetch, apply safe rewrites, and scaffold React, Vue, Nuxt, or Next.js.

Not an official TanStack package — shaped for the same Query API.

Quick start 

npx tanstack-fetch migrate --from all --dir ./src
npx tanstack-fetch migrate --from axios --framework react --write --no-provider
Enter fullscreen mode Exit fullscreen mode 
// before
queryFn: async ({ signal }) => {
  const res = await axios.get('/users', { signal, params: { page: 1 } })
  return res.data
}

// after
queryFn: ({ signal }) =>
  api.get<User[]>('/users', { signal, query: { page: 1 } })
Enter fullscreen mode Exit fullscreen mode
Flag Meaning
--from axios \
--framework react \
--provider / --no-provider React FetchProvider (default when asked: no)
--write Safe transforms + scaffold

--write is conservative — review reported findings (query params, interceptors, res.ok).

Links

Top comments (0)