honox icon indicating copy to clipboard operation
honox copied to clipboard

Type Error Occurs When Trying to Use React with createClient

Open p-chan opened this issue 1 year ago • 5 comments

What version of HonoX are you using?

0.1.4

What steps can reproduce the bug?

I attempted to set up the React renderer as described in the README, but encountered a type error.

Write ./app/client.ts.

import { createClient } from "honox/client";

createClient({
  hydrate: async (elem, root) => {
    const { hydrateRoot } = await import("react-dom/client");
    hydrateRoot(root, elem);
  },
  createElement: async (type: any, props: any) => {
    const { createElement } = await import("react");
    return createElement(type, props);
  },
});

Type Error Occurs.

Screenshot 2024-02-23 at 6 50 34

1. For the part hydrateRoot(root, elem);

Argument of type 'Node' is not assignable to parameter of type 'ReactNode'.

2. For the part createElement

Type '(type: any, props: any) => Promise<React.CElement<any, React.Component<any, any, any>>>' is not assignable to type 'CreateElement'.
  Type 'Promise<CElement<any, Component<any, any, any>>>' is not assignable to type 'Node | Promise<Node>'.
    Type 'Promise<CElement<any, Component<any, any, any>>>' is not assignable to type 'Promise<Node>'.
      Type 'ComponentElement<any, Component<any, any, any>>' is missing the following properties from type 'Node': baseURI, childNodes, firstChild, isConnected, and 46 more.

What is the expected behavior?

I expect that no type errors will occur.

What do you see instead?

No response

Additional information

It seems the same issue occurs at https://github.com/yusukebe/honox-playground/tree/main/projects/react. If necessary, I can create a minimal sandbox to reproduce the issue.

p-chan avatar Feb 22 '24 21:02 p-chan

Hi @p-chan

This is a known issue. So you don't have to create a project to reproduce! We can handle this later. Thanks!

yusukebe avatar Feb 22 '24 21:02 yusukebe