@modern-js/main-doc 2.64.1 → 2.64.2

package/docs/en/apis/app/hooks/src/entry.mdx

@@ -2,13 +2,14 @@
 title: entry.[tj]s
 sidebar_position: 4
 ---
-# entry.[tj]s
+
+# entry.[tj]sx
 
 :::info
 Using this file requires enabling [source.enableCustomEntry](/configure/app/source/enable-custom-entry).
 :::
 
-Normally, the [`routes/`](/apis/app/hooks/src/routes.html) and [`App.[tj]sx`](/apis/app/hooks/src/app) hook files can meet our needs. When we need to add custom behavior before component rendering or take full control of the webpack packaging entry, we can create `entry.[tj]s` file in the src or entry directory. Here are two cases for discussion:
+Normally, the [`routes/`](/apis/app/hooks/src/routes.html) and [`App.[tj]sx`](/apis/app/hooks/src/app) hook files can meet our needs. When we need to add custom behavior before component rendering or take full control of the webpack packaging entry, we can create `entry.[tj]s` file in the src or entry directory. Here are two cases for discussion。
 
 ## Add custom behavior before Render
 

package/docs/en/apis/app/hooks/src/entry.server.mdx

@@ -5,6 +5,10 @@ sidebar_position: 5
 
 # entry.server.[tj]sx
 
+:::info
+Using this file requires enabling [source.enableCustomEntry](/configure/app/source/enable-custom-entry).
+:::
+
 When the project initiates `server.ssr`, Modern.js generates a default Server-Side entry. The sample code is as follows:
 
 ```tsx title="entry.server.tsx"

package/docs/en/configure/app/source/enable-custom-entry.mdx

@@ -7,9 +7,7 @@ title: enableCustomEntry
 - **Type:** `boolean`
 - **Default:** `false`
 
-This option is used for custom Modern.js entries.
-
-When this option is enabled, Modern.js will use the `src/entry.[jt]sx` file as the project's entry point. For more details, refer to [Entries](/guides/concept/entries.html).
+This option is used for custom Modern.js entries. When this option is enabled, Modern.js will try to use the `src/entry.[jt]sx` file and `src/entry.server.[jt]sx` as the project's entry point.
 
 ## Example
 
@@ -39,3 +37,32 @@ beforeRender().then(() => {
   render(<ModernRoot />);
 });
 ```
+
+:::info
+For more browser entry details, refer to [Entries](/guides/concept/entries.html).
+:::
+
+
+create `src/entry.server.tsx` file，add custom behavior for rendering responses：
+
+```tsx
+import { renderString, createRequestHandler } from '@edenx/runtime/ssr/server';
+import type { HandleRequest } from '@edenx/runtime/ssr/server';
+
+const handleRequest: HandleRequest = async (request, ServerRoot, options) => {
+  // do something before rendering
+  const body = await renderString(request, <ServerRoot />, options);
+
+  const newBody = body + '<div>Byte-Dance</div>';
+
+  return new Response(newBody, {
+    headers: {
+      'content-type': 'text/html; charset=UTF-8',
+      'x-custom-header': 'abc',
+    },
+  });
+};
+
+export default createRequestHandler(handleRequest);
+```
+

package/docs/zh/apis/app/hooks/src/entry.mdx

@@ -2,14 +2,15 @@
 title: entry.[tj]s
 sidebar_position: 4
 ---
-# entry.[tj]s
 
-通常情况下[`routes/`](/apis/app/hooks/src/routes.html) 和 [`App.[tj]sx`](/apis/app/hooks/src/app) 钩子文件已经能满足我们的需求，当我们需要在组件渲染之前添加自定义行为或者完全接管 webpack 打包入口时，可以在 `src` 或者入口目录下放置 `entry.[tj]s`。 下面有分两种情况进行讨论：
+# entry.[tj]sx
 
 :::info
 使用该文件需要开启 [source.enableCustomEntry](/configure/app/source/enable-custom-entry)。
 :::
 
+通常情况下[`routes/`](/apis/app/hooks/src/routes.html) 和 [`App.[tj]sx`](/apis/app/hooks/src/app) 钩子文件已经能满足我们的需求，当我们需要在组件渲染之前添加自定义行为或者完全接管 webpack 打包入口时，可以在 `src` 或者入口目录下放置 `entry.[tj]s`。下面分两种情况进行讨论。
+
 ## 在组件渲染前添加自定义行为
 
 在 `src/entry.[tj]s` 中这样实现：

package/docs/zh/apis/app/hooks/src/entry.server.mdx

@@ -5,6 +5,10 @@ sidebar_position: 5
 
 # entry.server.[tj]sx
 
+:::info
+使用该文件需要开启 [source.enableCustomEntry](/configure/app/source/enable-custom-entry)。
+:::
+
 当项目开启 `server.ssr` 时，Modern.js 生成一个默认的 Server-Side 入口。示例代码如下：
 
 ```tsx title="entry.server.tsx"
@@ -28,7 +32,7 @@ export default createRequestHandler(handleRequest);
 
 ## 添加自定义行为
 
-如果用户需自定义 Server-Side Rendering 入口，可以在 `src/entry.server.ts`、`src/{entryName}/entry.server.ts` 中自定义 server 入口
+如果用户需自定义 Server-Side Rendering 入口，可以在 `src/entry.server.ts`、`src/{entryName}/entry.server.ts` 中自定义 server 入口。
 
 ```tsx title="src/entry.server.tsx"
 import { renderString, createRequestHandler } from '@edenx/runtime/ssr/server';

package/docs/zh/configure/app/source/enable-custom-entry.mdx

@@ -7,9 +7,7 @@ title: enableCustomEntry
 - **类型：** `boolean`
 - **默认值：** `false`
 
-该选项用于使用 Modern.js 自定义入口场景。
-
-开启此选项后，Modern.js 将使用 `src/entry.[jt]sx` 文件作为项目的入口， 具体使用姿势可参考[页面入口](/guides/concept/entries.html)。
+该选项用于使用 Modern.js 自定义入口场景。开启此选项后，Modern.js 将尝试使用 `src/entry.[jt]sx` 与 `src/entry.server.[jt]sx` 文件作为项目的入口。
 
 ## 示例
 
@@ -23,7 +21,7 @@ export default defineConfig({
 });
 ```
 
-创建 `src/entry.tsx` 文件：
+创建 `src/entry.tsx` 文件，在渲染前执行某些行为：
 
 ```tsx
 import { createRoot } from '@modern-js/runtime/react';
@@ -39,3 +37,31 @@ beforeRender().then(() => {
   render(<ModernRoot />);
 });
 ```
+
+:::info
+更多浏览器端入口相关内容可参考[页面入口](/guides/concept/entries.html)。
+:::
+
+创建 `src/entry.server.tsx` 文件，为渲染响应添加自定义行为：
+
+```tsx
+import { renderString, createRequestHandler } from '@edenx/runtime/ssr/server';
+import type { HandleRequest } from '@edenx/runtime/ssr/server';
+
+const handleRequest: HandleRequest = async (request, ServerRoot, options) => {
+  // do something before rendering
+  const body = await renderString(request, <ServerRoot />, options);
+
+  const newBody = body + '<div>Byte-Dance</div>';
+
+  return new Response(newBody, {
+    headers: {
+      'content-type': 'text/html; charset=UTF-8',
+      'x-custom-header': 'abc',
+    },
+  });
+};
+
+export default createRequestHandler(handleRequest);
+```
+

package/package.json

@@ -15,14 +15,14 @@
     "modern",
     "modern.js"
   ],
-  "version": "2.64.1",
+  "version": "2.64.2",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public",
     "provenance": true
   },
   "dependencies": {
-    "@modern-js/sandpack-react": "2.64.1"
+    "@modern-js/sandpack-react": "2.64.2"
   },
   "devDependencies": {
     "@rspress/shared": "1.40.2",
@@ -33,7 +33,7 @@
     "fs-extra": "^10",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "rspress": "1.40.2",
+    "rspress": "1.41.0",
     "ts-node": "^10.9.1",
     "typescript": "^5"
   },

package/rspress.config.ts

@@ -1,9 +1,6 @@
 import path from 'path';
-import type { NavItem } from '@rspress/shared';
 import { defineConfig } from 'rspress/config';
 
-const { version } = require('./package.json');
-
 const docPath = path.join(__dirname, 'docs');
 
 export default defineConfig({
@@ -17,6 +14,9 @@ export default defineConfig({
     checkDeadLinks: true,
     experimentalMdxRs: true,
   },
+  search: {
+    codeBlocks: true,
+  },
   head: [
     `
           <script>