Route.useLoaderData() always resolves to ReadableStream<any>
v1.97.15
Getting type error:
// app/routes/index.tsx
import * as fs from "node:fs";
import { createFileRoute, useRouter } from "@tanstack/react-router";
import { createServerFn } from "@tanstack/start";
const filePath = "count.txt";
async function readCount() {
return Number.parseInt(
await fs.promises.readFile(filePath, "utf-8").catch(() => "0"),
);
}
const getCount = createServerFn({
method: "GET",
}).handler(() => {
return readCount();
});
const updateCount = createServerFn({ method: "POST" })
.validator((d: number) => d)
.handler(async ({ data }) => {
const count = await readCount();
await fs.promises.writeFile(filePath, `${count + data}`);
});
export const Route = createFileRoute("/test")({
component: Home,
loader: async () => await getCount(),
});
function Home() {
const router = useRouter();
const state = Route.useLoaderData();
return (
<button
type="button"
onClick={() => {
updateCount({ data: 1 }).then(() => {
router.invalidate();
});
}}
>
Add 1 to {state}?
</button>
);
}// app/routes/index.tsx
import * as fs from "node:fs";
import { createFileRoute, useRouter } from "@tanstack/react-router";
import { createServerFn } from "@tanstack/start";
const filePath = "count.txt";
async function readCount() {
return Number.parseInt(
await fs.promises.readFile(filePath, "utf-8").catch(() => "0"),
);
}
const getCount = createServerFn({
method: "GET",
}).handler(() => {
return readCount();
});
const updateCount = createServerFn({ method: "POST" })
.validator((d: number) => d)
.handler(async ({ data }) => {
const count = await readCount();
await fs.promises.writeFile(filePath, `${count + data}`);
});
export const Route = createFileRoute("/test")({
component: Home,
loader: async () => await getCount(),
});
function Home() {
const router = useRouter();
const state = Route.useLoaderData();
return (
<button
type="button"
onClick={() => {
updateCount({ data: 1 }).then(() => {
router.invalidate();
});
}}
>
Add 1 to {state}?
</button>
);
}Getting type error:
Type 'ReadableStream<any>' is not assignable to type 'ReactNode'Type 'ReadableStream<any>' is not assignable to type 'ReactNode'