ꁅꀤꀸꍟꂦꈤ Comments

ꁅꀤꀸꍟꂦꈤ

•Created by bazeso on 5/5/2023 in #❓-help

You're trying to use @trpc/server in a non-server environment

getServerSideProps never runs in the browser so you can resolve this error by dynamically importing the server-side helpers in the getServerSideProps from a ssr.ts file in your server directory for example. See below:

export const getServerSideProps: GetServerSideProps = async () => {
  const { ssrHelpers } = await import('@/server/ssr');
  // ...
  return {
    props: {
      trpcState: ssrHelpers.dehydrate(),
    },
  };
};

export const getServerSideProps: GetServerSideProps = async () => {
  const { ssrHelpers } = await import('@/server/ssr');
  // ...
  return {
    props: {
      trpcState: ssrHelpers.dehydrate(),
    },
  };
};

13 replies