@modern-js/main-doc 2.61.0 → 2.62.1

package/docs/en/configure/app/source/transform-import.mdx

@@ -11,6 +11,7 @@ Transform the import path, which can be used to modularly import the subpath of
 
 ```ts
 type TransformImport =
+  | false
   | Array<{
       libraryName: string;
       libraryDirectory?: string;
@@ -61,3 +62,29 @@ When you add configurations for `antd` or `@arco-design/web-react`, the priority
 import RsbuildConig from '@site-docs-en/components/rsbuild-config-tooltip';
 
 <RsbuildConig />
+
+### Disable Default Config
+
+You can manually set `transformImport: false` to disable the default config.
+
+```js
+export default {
+  source: {
+    transformImport: false,
+  },
+};
+```
+
+You can also use the [function usage](https://rsbuild.dev/config/source/transform-import#function-type) of `transformImport` to modify the default configuration.
+
+```js
+export default {
+  source: {
+    transformImport: (imports) => {
+      return imports.filter(data => data.libraryName !== 'antd');
+    },
+  },
+};
+```
+
+For example, if you use `externals` to avoid bundling antd, because `transformImport` will convert the imported path of antd by default, the matching path changes and externals cannot take effect. At this time, you can disable `transformImport` to avoid this problem.

package/docs/en/guides/basic-features/render/ssr.mdx

@@ -113,7 +113,29 @@ If a Client Loader is defined for the route, it will be used to re-fetch the dat
 
 ### Component Rendering Error
 
-If a component throws an error during rendering, Modern.js automatically falls back to CSR mode and re-fetches the data. If re-rendering fails again, the `<ErrorBoundary>` component will be displayed.
+If the Data Loader executes correctly but the component rendering fails, SSR rendering will partially or completely fail, as shown in the following code:
+
+```tsx
+import { Await, useLoaderData } from '@modern-js/runtime/router';
+import { Suspense } from 'react';
+
+const Page = () => {
+  const data = useLoaderData();
+  const isNode = typeof window === 'undefined';
+  const undefinedVars = data.unDefined;
+  const definedVars = data.defined;
+
+  return (
+    <div>
+      {isNode ? undefinedVars.msg : definedVars.msg}
+    </div>
+  );
+};
+
+export default Page;
+```
+
+In this case, Modern.js will fallback the page to CSR and use the existing data from the Data Loader to render. If the rendering still fails, the `<ErrorBoundary>` component will be rendered.
 
 :::tip
 The behavior of component rendering errors is unaffected by `loaderFailureMode` and will not execute the Client Loader on the browser side.

package/docs/en/guides/get-started/tech-stack.mdx

@@ -12,7 +12,7 @@ In this document, you can learn about the main technology stack involved in the
 
 Modern.js uses [React 18](https://react.dev/) to build user interfaces and is also compatible with React 17.
 
-Rsbuild supports building Vue applications. If you need to use Vue, you can refer to ["Rsbuild - Vue"](https://rsbuild.dev/guide/framework/vue3).
+Rsbuild supports building Vue applications. If you need to use Vue, you can refer to ["Rsbuild - Vue"](https://rsbuild.dev/guide/framework/vue).
 
 ## Routing
 

package/docs/zh/configure/app/source/transform-import.mdx

@@ -11,6 +11,7 @@ configName: source.transformImport
 
 ```ts
 type TransformImport =
+  | false
   | Array<{
       libraryName: string;
       libraryDirectory?: string;
@@ -61,3 +62,29 @@ const defaultArcoConfig = [
 import RsbuildConig from '@site-docs/components/rsbuild-config-tooltip';
 
 <RsbuildConig />
+
+### 禁用默认配置
+
+你可以手动设置 `transformImport: false` 来关掉 transformImport 的默认行为。
+
+```js
+export default {
+  source: {
+    transformImport: false,
+  },
+};
+```
+
+你也可以使用 `transformImport` 的 [function 用法](https://rsbuild.dev/zh/config/source/transform-import#function-%E7%B1%BB%E5%9E%8B) 对默认配置进行自定义修改。
+
+```js
+export default {
+  source: {
+    transformImport: (imports) => {
+      return imports.filter(data => data.libraryName !== 'antd');
+    },
+  },
+};
+```
+
+比如，当你使用了 `externals` 来避免打包 antd 时，由于 `transformImport` 默认会转换 antd 的引用路径，导致匹配的路径发生了变化，因此 externals 无法正确生效，此时你可以设置关闭 `transformImport` 来避免该问题。

package/docs/zh/guides/basic-features/render/ssr.mdx

@@ -118,7 +118,29 @@ Modern.js 也支持通过 [`server.ssr`](/configure/app/server/ssr) 配置项中
 
 ### 组件渲染报错
 
-当组件渲染报错时，Modern.js 会自动降级到 CSR 模式，并重新发起数据请求。如果重新渲染仍然出错，则展示 `<ErrorBoundary>` 组件。
+如果 Data Loader 执行正常，但组件渲染报错时，SSR 渲染将会部分或完全失败，例如以下代码：
+
+```tsx
+import { Await, useLoaderData } from '@modern-js/runtime/router';
+import { Suspense } from 'react';
+
+const Page = () => {
+  const data = useLoaderData();
+  const isNode = typeof window === 'undefined';
+  const undefinedVars = data.unDefined;
+  const definedVars = data.defined;
+
+  return (
+    <div>
+      {isNode ? undefinedVars.msg : definedVars.msg}
+    </div>
+  );
+};
+
+export default Page;
+```
+
+此时，Modern.js 会将页面降级为 CSR，并利用 Data Loader 中已有的数据渲染。如果重新渲染仍然出错，则展示 `<ErrorBoundary>` 组件。
 
 :::tip
 组件渲染报错的行为，不会受到 `loaderFailureMode` 的影响，也不会在浏览器端执行 Client Loader。

package/docs/zh/guides/get-started/tech-stack.mdx

@@ -12,7 +12,7 @@ Modern.js 框架默认集成了一些社区中流行的库和开发工具。
 
 Modern.js 使用 [React 18](https://react.dev/) 来构建用户界面，同时也兼容 React 17。
 
-Modern.js 底层的 Rsbuild 支持构建 Vue 应用，如果你需要使用 Vue，可以参考 [Rsbuild - Vue](https://rsbuild.dev/zh/guide/framework/vue3)。
+Modern.js 底层的 Rsbuild 支持构建 Vue 应用，如果你需要使用 Vue，可以参考 [Rsbuild - Vue](https://rsbuild.dev/zh/guide/framework/vue)。
 
 ## 路由
 

package/package.json

@@ -15,17 +15,17 @@
     "modern",
     "modern.js"
   ],
-  "version": "2.61.0",
+  "version": "2.62.1",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public",
     "provenance": true
   },
   "dependencies": {
-    "@modern-js/sandpack-react": "2.61.0"
+    "@modern-js/sandpack-react": "2.62.1"
   },
   "devDependencies": {
-    "@rspress/shared": "1.35.3",
+    "@rspress/shared": "1.35.4",
     "@types/fs-extra": "9.0.13",
     "@types/node": "^16",
     "classnames": "^2",
@@ -33,7 +33,7 @@
     "fs-extra": "^10",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "rspress": "1.35.3",
+    "rspress": "1.35.4",
     "ts-node": "^10.9.1",
     "typescript": "^5"
   },