T
TanStack•4h ago
stormy-gold

Unknown file extension ".css"

Hello, I'm new to TanStack Start, so far everything is good and I love it! I am doing a fun experimental project and got the following error: 
Uncaught Error: Switched to client rendering because the server rendering errored:

Unknown file extension ".css" for /home/sal/dev/custom_chat/node_modules/.pnpm/katex@0.16.23/node_modules/katex/dist/katex.min.css
Uncaught Error: Switched to client rendering because the server rendering errored:

Unknown file extension ".css" for /home/sal/dev/custom_chat/node_modules/.pnpm/katex@0.16.23/node_modules/katex/dist/katex.min.css
pnpm why katex shows it's because I used the streamdown package I'm not sure what I'm supposed to do here, any help would be appreciated
No description
1 Reply
stormy-gold
stormy-goldOP•4h ago
I tried wrapping it in a <ClientOnly> but that didn't seem to affect it Here is the component 
"use client";

import { cn } from "~/lib/utils";
import { type ComponentProps, memo } from "react";
import { Streamdown } from "streamdown";

type ResponseProps = ComponentProps<typeof Streamdown>;

export const Response = memo(
  ({ className, ...props }: ResponseProps) => (
    <Streamdown
      className={cn("size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0", className)}
      {...props}
    />
  ),
  (prevProps, nextProps) => prevProps.children === nextProps.children
);

Response.displayName = "Response";
"use client";

import { cn } from "~/lib/utils";
import { type ComponentProps, memo } from "react";
import { Streamdown } from "streamdown";

type ResponseProps = ComponentProps<typeof Streamdown>;

export const Response = memo(
  ({ className, ...props }: ResponseProps) => (
    <Streamdown
      className={cn("size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0", className)}
      {...props}
    />
  ),
  (prevProps, nextProps) => prevProps.children === nextProps.children
);

Response.displayName = "Response";

Did you find this page helpful?