entry.client

entry.client

默认情况下,Remix 将为你处理客户端应用的 hydrating(水合)。如果你想自定义此行为,可以运行 npx remix reveal 来生成优先的 app/entry.client.tsx(或 .jsx)。此文件是浏览器的入口点,负责在你的 服务器入口模块 中对服务器生成的标记进行水合;但是,你也可以在此处初始化任何其他客户端代码。

¥By default, Remix will handle hydrating your app on the client for you. If you want to customize this behavior, you can run npx remix reveal to generate a app/entry.client.tsx (or .jsx) that will take precedence. This file is the entry point for the browser and is responsible for hydrating the markup generated by the server in your server entry module; however, you can also initialize any other client-side code here.

通常,此模块使用 ReactDOM.hydrateRoot 来补充已在服务器上生成的标记,并将其添加到你的 服务器入口模块 中。

¥Typically, this module uses ReactDOM.hydrateRoot to hydrate the markup already generated on the server in your server entry module.

这是一个基本示例:

¥Here's a basic example:

import { RemixBrowser } from "@remix-run/react";
import { startTransition, StrictMode } from "react";
import { hydrateRoot } from "react-dom/client";

startTransition(() => {
  hydrateRoot(
    document,
    <StrictMode>
      <RemixBrowser />
    </StrictMode>
  );
});

这是在浏览器中运行的第一段代码。你可以初始化客户端库、添加仅客户端使用的提供程序等。

¥This is the first piece of code that runs in the browser. You can initialize client side libraries, add client-only providers, etc.

Remix v2.17 中文网 - 粤ICP备13048890号