feat: new ssr #12489
Merged
feat: new ssr #12489
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…#12229) * refactor(preset): improve types for ssr request handler * refactor(preset-umi): provide unified request handler for ssr * refactor: add stream response header * refactor: correct ts lib usage * chore: update comment * refactor: warn for deprecated ssr exports * refactor: async-able for worker ssr request handler * refactor: update worker mode condition * refactor: type correct
* feat: SSR support useServerInsertedHTML * feat: ssr insert html * fix: string template * chore: update lock
* feat: ssr支持head body 配置 * feat: support ssr * fix: 回退metaloader执行逻辑判断 * fix: ts lint * feat: 优化部分ssr代码 * feat: add client metadata hydrate data * docs: hydtateFromRoot doc 修正 * fix: delete merge.with deps * fix: delete merge.with deps * fix: change hydrateFromRoot root to renderFromRoot * fix: NormalizeMeta component for render root * fix: NormalizeMeta component for render root --------- Co-authored-by: xiaoxiao <[email protected]> Co-authored-by: Jinbao1001 <[email protected]>
* feat: ssr支持head body 配置 * feat: support ssr * fix: 回退metaloader执行逻辑判断 * fix: ts lint * feat: 优化部分ssr代码 * feat: add client metadata hydrate data * docs: hydtateFromRoot doc 修正 * fix: delete merge.with deps * fix: delete merge.with deps * fix: change hydrateFromRoot root to renderFromRoot * fix: NormalizeMeta component for render root * fix: NormalizeMeta component for render root * fix: hydrate 遗留问题处理 * fix: ts-ignore window.__ * fix: 空格 * fix: lint --------- Co-authored-by: xiaoxiao <[email protected]> Co-authored-by: Jinbao1001 <[email protected]>
* fix: wrong react-dom server api for worker ssr mode * refactor: rename config * refactor: correct logic * fix: locked stream in ssr
…12279) * feat: ssr支持head body 配置 * feat: support ssr * fix: 回退metaloader执行逻辑判断 * fix: ts lint * feat: 优化部分ssr代码 * feat: add client metadata hydrate data * docs: hydtateFromRoot doc 修正 * fix: delete merge.with deps * fix: delete merge.with deps * fix: change hydrateFromRoot root to renderFromRoot * fix: NormalizeMeta component for render root * fix: NormalizeMeta component for render root * fix: hydrate 遗留问题处理 * fix: ts-ignore window.__ * fix: 空格 * fix: lint * feat: addEntryCode to ssr and share the pluginManager * fix: curry and createPluginManager * feat: 提取公共 request 方法 * fix: serverloaderRequest * fix: serverloaderRequest * fix: serverloaderRequest * fix: serverloaderRequest * fix: curry * fix: curry * fix: 补充importsAhead and imports * fix: 条件判断更换 * fix: 代码优化 * fix: tslint * fix: tslint * fix: async function export * fix: add g_umi export and some fixded * fix: string export * fix: await clientroutePatch * feat: patchClientRoutes to async * fix: ssr禁用 inintial state loading * feat: 提供render钩子给主应用执行 * feat: 提供render钩子给主应用执行 * feat: 提供render钩子给主应用执行 * feat: to async * feat: stream render 钩子 * fix: 修改render执行时机 * fix: 移出otherwise逻辑 --------- Co-authored-by: xiaoxiao <[email protected]> Co-authored-by: Jinbao1001 <[email protected]>
* feat: qiankun 插件支持 ssr * fix: cr * fix: 修改 external 的机制 * fix: 增加 ssr render 后，处理 qiankun 的生命周期
* feat: use prerender html directly in ssg * fix: ssg * fix: add bootstrap script
* fix: ssr manifest 正确读取环境变量 * chore: 新增 ssr 黑盒变量 SSR_RESOURCE_DIR
* feat: qiankun 插件支持 ssr * fix: cr * fix: 修改 external 的机制 * fix: 增加 ssr render 后，处理 qiankun 的生命周期 * fix: qiankun slave ssr * fix: change ssr to isServer
* fix: ssr downgrade init * feat: add deprecated * chore: 代码优化 * fix: woker don't need to inject umi.js
* fix: ssr mako init * chore: 删除冗余webpack配置代码 * feat: finish mako bundler for ssr * feat: generator manifest * refactor: mako outputpath use bundler-webpack default value
…12363) * refactor(preset-umi): handle unexpected route absPath in route preload * chore: correct logic
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
演练这个更改概述涉及多个项目中的一系列依赖项更新和优化配置，特别是 更改
序列图sequenceDiagram
participant User
participant Server
participant Component as React Component
participant CSS as CSSinJS
participant SSR as SSR Process
User ->> Server: 请求渲染页面
Server ->> Component: 初始化 React 组件
Component ->> CSS: 使用 `@ant-design/cssinjs` 提取样式
CSS ->> SSR: 在 SSR 进程中插入 CSS
SSR ->> Server: 生成带样式的 HTML
Server ->> User: 返回完整页面
诗歌
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configration File (
|
|
Size Change: +8.42 kB (+0.08%) Total Size: 9.94 MB
ℹ️ View Unchanged
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 15
Outside diff range and nitpick comments (14)
packages/bundler-webpack/src/config/definePlugin.test.ts (1)
Line range hint
52-52: 避免使用 delete 操作符静态分析工具指出使用
delete操作符可能会影响性能。建议用undefined赋值来替代。- delete process.env.SOCKET_SERVER; + process.env.SOCKET_SERVER = undefined;Also applies to: 64-64
packages/preset-umi/src/commands/dev/createRouteMiddleware.ts (1)
Line range hint
10-10: 避免使用 'Function' 作为类型根据静态分析工具的提示，不建议使用 'Function' 作为类型，因为它可能导致错误。建议您为
onStats变量定义一个更具体的函数类型，例如明确参数和返回值的类型。- let onStats: Function | null = null; + let onStats: ((stats: Stats) => void) | null = null;packages/preset-umi/src/features/devTool/devTool.ts (1)
Line range hint
78-80: 移除不必要的 else 子句在此代码段中，由于之前的分支已经提前结束，所以这个 else 子句是多余的。建议移除以简化代码结构。
- if (isMFSUDone && isBundleDone) { - return res.end(); - } - - return res.status(400).end(); + if (!isMFSUDone || !isBundleDone) { + return res.status(400).end(); + } + return res.end();packages/mfsu/src/mfsu/strategyStaticAnalyze.ts (1)
Line range hint
14-20: 使用dangerouslySetInnerHTML这里使用了
dangerouslySetInnerHTML来设置 HTML 内容，这可能会引起 XSS 攻击的风险。建议仅在确保内容安全的情况下使用，或者寻找其他方式来实现。- <noscript dangerouslySetInnerHTML={{ __html: `<b>Enable JavaScript to run this app.</b>` }} /> + <noscript><b>Enable JavaScript to run this app.</b></noscript>packages/preset-umi/src/types.ts (1)
Line range hint
148-152: 避免使用{}作为类型在 TypeScript 中，使用
{}作为类型可能会导致意外的行为，因为它表示任何非 null/undefined 的值。建议明确指定对象的结构。- modifyHTMLFavicon: IModify<string[], {}>; + modifyHTMLFavicon: IModify<string[], Record<string, unknown>>;packages/preset-umi/src/commands/build.ts (1)
Line range hint
72-72: 优化类型定义在这三个地方使用了
Object类型，这不是一个好的实践，因为它代表了任何非空值。建议定义更具体的类型来代替Object。- async (memo: any, args: Object) => { + async (memo: any, args: Record<string, unknown>) => {Also applies to: 80-80, 87-87
packages/renderer-react/src/browser.tsx (1)
Line range hint
282-337: 客户端和服务器加载器逻辑代码中处理了客户端和服务器加载器的逻辑。这部分逻辑较为复杂，建议添加更多的注释和文档，以帮助其他开发者理解这些逻辑的工作方式。
packages/plugins/src/qiankun/slave.ts (1)
Line range hint
208-209: 移除不必要的 Boolean 调用。此处的
Boolean调用是多余的，直接使用条件表达式即可进行布尔值转换。- shouldNotAddLibraryChunkName = api.env === 'production' || !Boolean(api.config.mfsu), + shouldNotAddLibraryChunkName = api.env === 'production' || !api.config.mfsu,packages/preset-umi/src/commands/dev/dev.ts (1)
Line range hint
279-279: 避免使用 'Object' 作为类型这里使用了 'Object' 作为类型，这种做法不够明确，可能会引起类型安全问题。建议具体定义对象的形状，以提高代码的可维护性和类型安全。
- const chainWebpack = async (memo: any, args: Object) => { + const chainWebpack = async (memo: any, args: { [key: string]: any }) => {Also applies to: 287-287, 294-294
packages/server/src/ssr.ts (3)
Line range hint
125-159: 不要在 Promise 执行函数中使用 async这里在 Promise 的执行函数中使用了
async关键字，这是不推荐的做法，因为它可能导致意外的错误处理和状态管理问题。建议改为使用显式的 Promise 链。- await Promise.all( + Promise.all( matches .filter((id: string) => routes[id].hasServerLoader) .map( (id: string) => new Promise<void>((resolve) => { executeLoader({ routeKey: id, routesWithServerLoader, serverLoaderArgs, }).then(loaderData => { // 处理 loaderData 和 metadataLoaderData resolve(); }); }), ), );
Line range hint
216-273: 不要在 Promise 执行函数中使用 async与之前的问题相同，这里也在 Promise 的执行函数中使用了
async关键字。建议改为使用显式的 Promise 链来处理异步操作。- return new Promise(async (resolve, reject) => { + return new Promise((resolve, reject) => { const jsx = await jsxGeneratorDeferrer(url); if (jsx) { const [JSXProvider, serverInsertedHTMLCallbacks] = createJSXProvider( opts.ServerInsertedHTMLContext.Provider, ); // 处理 JSX 和 HTML resolve(html); } else { reject(new Error('No JSX returned')); } });
Line range hint
81-81: 使用 React 的标准方式传递 children在这些行中，通过属性传递了 children，这不是 React 推荐的做法。建议使用 React.createElement 的参数来传通 children。
- React.createElement(React.Fragment, { - children: Array.from(serverInsertedHTMLCallbacks || []).map((callback) => - callback(), - ), - }); + React.createElement(React.Fragment, null, + Array.from(serverInsertedHTMLCallbacks || []).map((callback) => + callback(), + ), + );Also applies to: 195-196, 259-260
packages/preset-umi/src/features/tmpFiles/tmpFiles.ts (2)
Line range hint
264-325: 检查api.applyPlugins方法的使用。在此代码段中，多次调用
api.applyPlugins方法，但未看到对返回值的错误处理。在异步编程中，处理可能的异常是很重要的。建议添加错误处理逻辑，以避免程序在运行时出现未被捕获的异常。
Line range hint
504-556: 优化umi.server.ts文件的生成逻辑。在生成
umi.server.ts文件的代码中，有大量的 JSON 字符串操作和正则表达式的使用。这可能会影响性能，特别是在处理大量路由时。可以考虑使用更高效的数据处理方式，例如直接操作对象而不是转换为字符串后再处理。
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
Files selected for processing (50)
- examples/max/package.json (1 hunks)
- examples/mf-host/package.json (1 hunks)
- examples/mf-remote/package.json (1 hunks)
- examples/qiankun-master/package.json (1 hunks)
- examples/qiankun-slave-app2/package.json (1 hunks)
- examples/qiankun-slave/package.json (1 hunks)
- examples/ssr-demo/.umirc.ts (1 hunks)
- examples/ssr-demo/mako.config.json (1 hunks)
- examples/ssr-demo/package.json (1 hunks)
- examples/ssr-demo/src/layouts/index.tsx (1 hunks)
- examples/ssr-demo/src/pages/index.tsx (3 hunks)
- package.json (3 hunks)
- packages/bundler-webpack/src/config/definePlugin.test.ts (2 hunks)
- packages/bundler-webpack/src/config/definePlugin.ts (1 hunks)
- packages/mfsu/src/mfsu/strategyStaticAnalyze.ts (1 hunks)
- packages/plugins/libs/qiankun/master/masterRuntimePlugin.tsx (2 hunks)
- packages/plugins/libs/qiankun/slave/slaveRuntimePlugin.ts (1 hunks)
- packages/plugins/src/initial-state.ts (1 hunks)
- packages/plugins/src/qiankun/master.ts (1 hunks)
- packages/plugins/src/qiankun/slave.ts (2 hunks)
- packages/plugins/src/utils/modelUtils.test.ts (3 hunks)
- packages/preset-umi/package.json (1 hunks)
- packages/preset-umi/src/commands/build.ts (5 hunks)
- packages/preset-umi/src/commands/dev/createRouteMiddleware.ts (2 hunks)
- packages/preset-umi/src/commands/dev/dev.ts (2 hunks)
- packages/preset-umi/src/features/appData/umiInfo.ts (1 hunks)
- packages/preset-umi/src/features/devTool/devTool.ts (1 hunks)
- packages/preset-umi/src/features/esbuildHelperChecker/esbuildHelperChecker.ts (1 hunks)
- packages/preset-umi/src/features/exportStatic/exportStatic.ts (2 hunks)
- packages/preset-umi/src/features/mako/mako.ts (3 hunks)
- packages/preset-umi/src/features/okam/okam.ts (1 hunks)
- packages/preset-umi/src/features/ssr/mako/mako.ts (1 hunks)
- packages/preset-umi/src/features/ssr/ssr.ts (6 hunks)
- packages/preset-umi/src/features/ssr/utils.ts (2 hunks)
- packages/preset-umi/src/features/tmpFiles/tmpFiles.ts (8 hunks)
- packages/preset-umi/src/types.ts (1 hunks)
- packages/preset-umi/src/utils/platform.ts (1 hunks)
- packages/preset-umi/templates/server.tpl (3 hunks)
- packages/preset-umi/templates/umi.tpl (2 hunks)
- packages/renderer-react/package.json (1 hunks)
- packages/renderer-react/src/appContext.ts (3 hunks)
- packages/renderer-react/src/browser.tsx (6 hunks)
- packages/renderer-react/src/html.tsx (1 hunks)
- packages/renderer-react/src/index.ts (1 hunks)
- packages/renderer-react/src/server.tsx (2 hunks)
- packages/renderer-react/src/types.ts (2 hunks)
- packages/server/package.json (1 hunks)
- packages/server/src/server.ts (1 hunks)
- packages/server/src/ssr.ts (17 hunks)
- packages/server/src/types.ts (2 hunks)
Files not reviewed due to errors (2)
- packages/preset-umi/src/features/ssr/mako/mako.ts (no review received)
- packages/preset-umi/templates/umi.tpl (no review received)
Files skipped from review due to trivial changes (12)
- examples/max/package.json
- examples/mf-host/package.json
- examples/mf-remote/package.json
- examples/qiankun-master/package.json
- examples/qiankun-slave-app2/package.json
- examples/qiankun-slave/package.json
- examples/ssr-demo/mako.config.json
- examples/ssr-demo/package.json
- packages/preset-umi/package.json
- packages/renderer-react/package.json
- packages/server/package.json
- packages/server/src/server.ts
Additional context used
Biome
examples/ssr-demo/src/layouts/index.tsx
[error] 13-13: Avoid passing content using the dangerouslySetInnerHTML prop. (lint/security/noDangerouslySetInnerHtml)
Setting content using code can expose users to cross-site scripting (XSS) attacks
packages/bundler-webpack/src/config/definePlugin.test.ts
[error] 52-52: Avoid the delete operator which can impact performance. (lint/performance/noDelete)
Unsafe fix: Use an undefined assignment instead.
[error] 64-64: Avoid the delete operator which can impact performance. (lint/performance/noDelete)
Unsafe fix: Use an undefined assignment instead.
packages/preset-umi/src/commands/dev/createRouteMiddleware.ts
[error] 10-10: Don't use 'Function' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the function shape. This type accepts any function-like value, which can be a common source of bugs.
examples/ssr-demo/src/pages/index.tsx
[error] 67-67: Unexpected empty object pattern. (lint/correctness/noEmptyPattern)
[error] 32-32: Avoid passing content using the dangerouslySetInnerHTML prop. (lint/security/noDangerouslySetInnerHtml)
Setting content using code can expose users to cross-site scripting (XSS) attacks
packages/preset-umi/src/features/devTool/devTool.ts
[error] 78-80: This else clause can be omitted because previous branches break early. (lint/style/noUselessElse)
Unsafe fix: Omit the else clause.
packages/renderer-react/src/html.tsx
[error] 48-55: This else clause can be omitted because previous branches break early. (lint/style/noUselessElse)
Unsafe fix: Omit the else clause.
[error] 53-55: This else clause can be omitted because previous branches break early. (lint/style/noUselessElse)
[error] 91-93: This else clause can be omitted because previous branches break early. (lint/style/noUselessElse)
Unsafe fix: Omit the else clause.
[error] 126-126: Provide a lang attribute when using the html element. (lint/a11y/useHtmlLang)
Setting a lang attribute on HTML document elements configures the languageused by screen readers when no user default is specified.
[error] 16-16: Avoid passing content using the dangerouslySetInnerHTML prop. (lint/security/noDangerouslySetInnerHtml)
Setting content using code can expose users to cross-site scripting (XSS) attacks
[error] 30-30: Avoid passing content using the dangerouslySetInnerHTML prop. (lint/security/noDangerouslySetInnerHtml)
Setting content using code can expose users to cross-site scripting (XSS) attacks
[error] 99-99: Avoid passing content using the dangerouslySetInnerHTML prop. (lint/security/noDangerouslySetInnerHtml)
Setting content using code can expose users to cross-site scripting (XSS) attacks
[error] 172-172: Avoid passing content using the dangerouslySetInnerHTML prop. (lint/security/noDangerouslySetInnerHtml)
Setting content using code can expose users to cross-site scripting (XSS) attacks
packages/preset-umi/src/types.ts
[error] 148-148: Don't use '{}' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the object shape. '{}' means "any non-nullable value".
[error] 149-149: Don't use '{}' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the object shape. '{}' means "any non-nullable value".
[error] 150-150: Don't use '{}' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the object shape. '{}' means "any non-nullable value".
[error] 151-151: Don't use '{}' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the object shape. '{}' means "any non-nullable value".
[error] 152-152: Don't use '{}' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the object shape. '{}' means "any non-nullable value".
[error] 177-177: Don't use '{}' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the object shape. '{}' means "any non-nullable value".
packages/plugins/src/qiankun/master.ts
[error] 48-48: Change to an optional chain. (lint/complexity/useOptionalChain)
Unsafe fix: Change to an optional chain.
packages/preset-umi/src/commands/build.ts
[error] 72-72: Don't use 'Object' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the object shape. This type means "any non-nullable value", which is slightly better than 'unknown', but it's still a broad type.
[error] 80-80: Don't use 'Object' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the object shape. This type means "any non-nullable value", which is slightly better than 'unknown', but it's still a broad type.
[error] 87-87: Don't use 'Object' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the object shape. This type means "any non-nullable value", which is slightly better than 'unknown', but it's still a broad type.
packages/preset-umi/src/features/ssr/ssr.ts
[error] 66-66: Avoid the delete operator which can impact performance. (lint/performance/noDelete)
Unsafe fix: Use an undefined assignment instead.
packages/plugins/src/qiankun/slave.ts
[error] 138-139: Change to an optional chain. (lint/complexity/useOptionalChain)
Unsafe fix: Change to an optional chain.
[error] 208-209: Avoid redundant
Booleancall (lint/complexity/noExtraBooleanCast)It is not necessary to use
Booleancall when a value will already be coerced to a boolean.
Unsafe fix: Remove redundantBooleancall
[error] 210-210: Change to an optional chain. (lint/complexity/useOptionalChain)
Unsafe fix: Change to an optional chain.
packages/preset-umi/src/commands/dev/dev.ts
[error] 279-279: Don't use 'Object' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the object shape. This type means "any non-nullable value", which is slightly better than 'unknown', but it's still a broad type.
[error] 287-287: Don't use 'Object' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the object shape. This type means "any non-nullable value", which is slightly better than 'unknown', but it's still a broad type.
[error] 294-294: Don't use 'Object' as a type. (lint/complexity/noBannedTypes)
Prefer explicitly define the object shape. This type means "any non-nullable value", which is slightly better than 'unknown', but it's still a broad type.
packages/server/src/ssr.ts
[error] 125-159: Promise executor functions should not be
async. (lint/suspicious/noAsyncPromiseExecutor)
[error] 216-273: Promise executor functions should not be
async. (lint/suspicious/noAsyncPromiseExecutor)
[error] 362-363: The assignment should not be in an expression. (lint/suspicious/noAssignInExpressions)
The use of assignments in expressions is confusing.
Expressions are often considered as side-effect free.
[error] 81-81: Avoid passing children using a prop (lint/correctness/noChildrenProp)
The canonical way to pass children in React is to use additional arguments to React.createElement
[error] 195-196: Avoid passing children using a prop (lint/correctness/noChildrenProp)
The canonical way to pass children in React is to use additional arguments to React.createElement
[error] 259-260: Avoid passing children using a prop (lint/correctness/noChildrenProp)
The canonical way to pass children in React is to use additional arguments to React.createElement
Additional comments not posted (39)
packages/preset-umi/src/utils/platform.ts (1)
1-3: 代码检查通过。这段代码用于检测操作系统是否为Windows，逻辑正确且简洁。
packages/preset-umi/src/features/appData/umiInfo.ts (1)
6-10: 代码检查通过。此代码块正确地在客户端环境中添加了版本信息到全局对象
window.g_umi，并且有对window是否存在的检查，避免了服务器端执行时出错。examples/ssr-demo/.umirc.ts (1)
4-20: 配置检查通过。此配置文件为SSR和静态导出设置了多个选项，包括一个名为
mako的新构建器。所有配置项都明确且合理设置。packages/preset-umi/src/features/okam/okam.ts (1)
6-6: 代码检查通过。此代码块基于
mako配置启用功能，并添加了对Node.js版本的检查，确保mako只在支持的版本上运行。packages/renderer-react/src/index.ts (1)
30-30: 新增导出项审查代码中添加了新的导出项，用于支持 SSR 和数据处理的功能。请确保这些新的导出在项目中的其他部分也有正确的使用。
Verification successful
新增导出项审查
代码中添加的导出项
useLoaderData、useRouteProps、useSelectedRoutes和useServerLoaderData已在项目的多个文件中使用，包括appContext.ts、routes.tsx以及多个示例文件。这表明这些导出项已按预期使用。
packages/renderer-react/src/appContext.tspackages/renderer-react/src/routes.tsx- 多个示例文件 (
examples/ssr-webpack,examples/ssr-demo-2,examples/ssr-demo,examples/ssr-todos,examples/route-props)Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # 检查新导出函数的使用情况 rg --type ts "useLoaderData|useRouteProps|useSelectedRoutes|useServerLoaderData"Length of output: 3212
packages/plugins/libs/qiankun/slave/slaveRuntimePlugin.ts (1)
6-9: SSR 场景下的条件检查在
render函数中添加了对window对象是否定义的检查，这是在 SSR 场景下常见的做法，以确保代码不会在服务器环境中执行。建议添加注释说明此检查的必要性，以便未来的维护者理解。packages/bundler-webpack/src/config/definePlugin.test.ts (1)
16-16: 测试用例中添加环境变量在测试用例中正确地添加了
'process.env.SSR_MANIFEST'环境变量，以支持新的 SSR 功能。此更改看起来符合预期。Also applies to: 35-35
packages/renderer-react/src/server.tsx (1)
10-25: 服务器端渲染组件设置审查
getClientRootComponent函数为服务器端渲染设置了 React 组件，应用了多个插件和配置。建议增加更详细的文档，说明函数的行为和各个插件之间的交互。packages/preset-umi/src/commands/dev/createRouteMiddleware.ts (2)
17-18: 优化getStats函数的逻辑您添加了一个新的条件检查，以处理当编译器不存在且
api.config.mako为真的情况。这似乎是为了支持新的mako构建系统。请确认这种情况下返回的静态资源配置是否正确。
35-35: 确保getStats函数调用正确处理您在这里使用了
await getStats(opts.api)来获取编译统计信息，并将其用于构建资产映射。这是一个好的改进，因为它确保了资产映射总是基于最新的编译结果。请确保这个改动在所有相关的部署和测试环境中都能正常工作。packages/server/src/types.ts (3)
1-22: 扩展了IOpts接口您在
IOpts接口中添加了多个新属性，如mountElementId,esmScript,modifyHTML, 和historyType。这些改动支持了更灵活的 SSR 配置。请确保这些新属性在文档和类型定义中都有清晰的描述。
25-25: 新增IUserExtraRoute类型您定义了一个新的类型
IUserExtraRoute，它可以是一个字符串或一个包含path和prerender属性的对象。这似乎是为了支持更复杂的路由配置。请确保这个新类型在相关的文档中有详细的介绍和示例。
67-74: 扩展了IhtmlPageOpts接口在
IhtmlPageOpts接口中添加了新的属性，如headScripts,links,styles,favicons, 和scripts。这将允许用户在生成 HTML 页面时更灵活地配置资源。请确保所有新属性都经过充分测试，特别是在不同的 SSR 场景下。packages/bundler-webpack/src/config/definePlugin.ts (1)
69-69: 添加 SSR_MANIFEST 环境变量此修改用于支持服务器端渲染(SSR)的清单文件路径配置。确保此环境变量的使用符合预期，并在实际部署中进行测试。
packages/renderer-react/src/types.ts (1)
Line range hint
1-98: 代码类型定义检查请确保所有接口和类型定义都清晰且一致，以便在项目中广泛使用。特别是对于全局的类型定义，如
Window和IRoute，确保它们的属性和方法都被适当地注释和文档化，以便于其他开发者理解和使用。packages/preset-umi/templates/server.tpl (1)
26-26: SSR 配置模板更新更新了 SSR manifest 的处理方式，以及对其他几个配置项的引入。请确保这些更改在实际部署中能正确工作，并且与整体配置兼容。
Also applies to: 54-54, 62-62, 64-64
packages/preset-umi/src/features/esbuildHelperChecker/esbuildHelperChecker.ts (1)
93-93: 审查代码逻辑和配置条件在这段代码中，有多个条件判断是否执行
checkDir函数。这些条件涉及配置和环境变量，确保在特定配置或环境下不执行冗余的检查。建议审查这些条件是否覆盖了所有预期的场景，以及是否有潜在的配置组合可能导致意外行为。packages/renderer-react/src/appContext.ts (3)
52-52: 标记过时函数此函数已被标记为过时，请确保文档中有指向新函数
useLoaderData的引导，并检查是否所有旧的函数调用都已更新，以避免在未来的版本中出现问题。
101-101: 标记过时函数与上文相同，此函数也被标记为过时。重复的标记说明了代码迁移的过程中可能存在的问题，建议彻底检查并清理所有相关的旧代码调用。
108-117: 合并数据逻辑此函数用于合并来自服务端和客户端的数据。建议审查数据合并的逻辑是否可能导致数据冲突或不一致，特别是在并发环境下。
packages/plugins/src/initial-state.ts (1)
55-55: 条件渲染逻辑此处的条件渲染逻辑用于在应用加载时显示加载组件，但仅在客户端环境下执行。建议检查此逻辑是否能正确处理所有预期的加载状态，以及是否有潜在的渲染时序问题或性能影响。
packages/plugins/src/utils/modelUtils.test.ts (1)
Line range hint
202-222: 测试代码的书写格式这段测试代码用于检查 TypeScript 装饰器的处理。建议确保测试覆盖所有相关的用例，特别是边缘情况和异常处理。此外，检查是否所有的测试都遵循了一致的格式和命名约定。
packages/plugins/libs/qiankun/master/masterRuntimePlugin.tsx (2)
80-83: 处理 SSR 场景这段代码在 SSR 场景下直接返回了旧的渲染函数，这是为了避免在服务器端执行不必要的客户端逻辑。建议确保这种处理方式与整体的服务器端渲染策略一致，并检查是否有潜在的服务器端资源泄露或性能问题。
145-148: SSR 场景下的路由处理在 SSR 场景下，此函数直接返回，避免执行客户端特定的路由处理逻辑。建议检查这种快速返回的做法是否可能导致路由配置中的某些信息在服务器端渲染时被忽略，从而影响渲染结果的正确性。
packages/mfsu/src/mfsu/strategyStaticAnalyze.ts (3)
1-1: 优化导入语句的顺序建议将导入语句按照一定的顺序（例如：库、类型、本地文件）进行排序，以增加代码的可读性。
- import { logger, printHelp, winPath } from '@umijs/utils'; + import { printHelp, logger, winPath } from '@umijs/utils';
Line range hint
6-12: 函数isUrl的实现这个函数用于检测一个字符串是否为 URL。实现逻辑是正确的，但可以考虑添加更多注释来解释每个条件的具体意义，这样可以帮助其他开发者更好地理解代码。
Line range hint
22-38: 全局数据脚本组件的实现这个组件负责将一些全局数据嵌入到 HTML 中。代码实现上没有问题，但同样使用了
dangerouslySetInnerHTML，需要确保嵌入的数据是安全的。package.json (2)
141-142: 使用overrides来解决依赖问题这里使用
overrides来固定某些依赖库的版本，这是处理依赖冲突的一种有效方式。建议在文档中添加对这种做法的解释，以帮助新成员理解。
104-105: 更新react和react-dom的版本这里将
react和react-dom的版本从18.1.0更新到18.3.1。这是一个重要的更新，因为它可能包含性能改进和 bug 修复。建议检查整个项目以确保没有与新版本不兼容的地方。packages/plugins/src/qiankun/master.ts (1)
214-226: 在 SSR 场景下处理qiankun依赖这里的代码逻辑是在 SSR 场景下将
qiankun作为外部依赖处理，避免将其打包进产品中。这是一个很好的实践，可以减少包的大小并提高加载速度。packages/preset-umi/src/commands/build.ts (2)
110-115: 检查配置结构代码中新增了
plugins和config的配置项。请确保这些配置项的使用与项目其他部分保持一致，并且这些配置是必要的。Verification successful
检查配置结构
根据检索结果，
plugins和config配置项在项目中被广泛使用。代码中的新增配置项与项目的其他部分保持一致，且这些配置项是必要的。
plugins和config配置在多个文件中都有出现，确保了代码的一致性。- 没有发现明显的配置不一致或冗余配置。
Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the usage of new configuration items. # Test: Search for the usage of `plugins` and `config` in the project files. Expect: Consistent usage across the project. rg --type ts "plugins|config"Length of output: 197688
146-146: 使用环境变量这里使用了环境变量
OKAM来动态引入模块。建议验证这个环境变量在部署和开发环境中是否都已正确设置。packages/preset-umi/src/features/exportStatic/exportStatic.ts (2)
Line range hint
21-23: 引入新的构建器代码中引入了名为
makoBuiler的新构建器。建议检查这个构建器的实现，确保它符合项目的构建需求和标准。
Line range hint
33-39: 配置架构检查此处为
ssr配置添加了新的可选项。请确保这些新配置项的文档和类型定义都已更新，以帮助开发者了解如何正确使用它们。Verification successful
配置架构检查
已确认在文档和类型定义中更新了新的 SSR 配置项。以下文件中包含相关信息：
- 文档更新：
docs/docs/docs/api/config.md中提到exportStatic和ssr的配置。- 类型定义更新：
packages/preset-umi/src/types.ts中有ssr的类型定义。packages/preset-umi/src/features/ssr/ssr.ts中有serverBuildTarget和builder的定义。这些更新确保了开发者能够了解如何正确使用新的 SSR 配置项。
Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the documentation for new SSR configuration options. # Test: Search for documentation comments related to new SSR configuration options. Expect: Documentation should be updated. rg --type md "serverBuildTarget|builder"Length of output: 780
Script:
#!/bin/bash # Description: Verify the documentation and type definitions for new SSR configuration options. # Test: Search for documentation comments related to new SSR configuration options. Expect: Documentation should be updated. rg --type md "ssr|serverBuildTarget|builder" # Test: Search for type definitions related to new SSR configuration options. Expect: Type definitions should be updated. rg --type ts "ssr|serverBuildTarget|builder"Length of output: 10095
packages/preset-umi/src/features/ssr/ssr.ts (1)
191-197: 构建器逻辑这里根据不同的构建器进行不同的构建操作。建议增加对每种构建器的详细注释，说明它们各自的用途和差异，以便维护者更好地理解代码。
packages/renderer-react/src/browser.tsx (1)
386-412: React DOM 渲染逻辑这里的代码负责处理 React DOM 的渲染。建议检查
hydrateRoot和render方法的使用，确保它们在不同的渲染场景下都能正确工作。Verification successful
React DOM 渲染逻辑
经过验证，
hydrateRoot和render方法在packages/renderer-react/src/browser.tsx文件中的使用是正确的，并且在不同的渲染场景下能够正常工作。
hydrateRoot方法在第 398 行使用，条件逻辑合理。render方法在第 401 行使用，符合预期的渲染逻辑。Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the correct usage of ReactDOM methods across different rendering scenarios. # Test: Search for usage of `hydrateRoot` and `render` in the project. Expect: Consistent and correct usage. rg --type ts "hydrateRoot|render"Length of output: 43876
packages/plugins/src/qiankun/slave.ts (2)
230-237: 确保服务器端渲染和客户端渲染的生命周期函数正确处理。这段代码正确地处理了服务器端和客户端的生命周期函数，通过条件判断确保在服务器端时不执行任何操作。这是一个很好的实践，确保了代码的健壯性。
183-187: 优化建议：使用可选链简化代码。这里的条件判断可以通过使用可选链操作符来简化，使代码更加简洁易读。
- if (ssr) { - return; - } + return ssr ? undefined : config;Likely invalid or redundant comment.
packages/preset-umi/src/commands/dev/dev.ts (1)
360-364: 优化配置对象的构建这里的配置对象构建方式可以优化，避免在每次调用时都进行复制和扩展操作，这样可以提高代码的执行效率。
[REFACTOR_SUGGESTion]- plugins: api.config.mako?.plugins, - config: { - outputPath: api.userConfig.outputPath || 'dist', - ...api.config, - }, + config: Object.assign({}, api.config, { + outputPath: api.userConfig.outputPath || 'dist', + plugins: api.config.mako?.plugins, + }),
| @@ -2,11 +2,11 @@ import { importLazy, lodash, winPath } from '@umijs/utils'; | |||
| import { existsSync, readdirSync } from 'fs'; | |||
| import { basename, dirname, join } from 'path'; | |||
| import { RUNTIME_TYPE_FILE_NAME } from 'umi'; | |||
| import { getMarkupArgs } from '../../commands/dev/getMarkupArgs'; | |||
There was a problem hiding this comment.
请添加对新引入的 getMarkupArgs 函数的说明。
在文件中引入了 getMarkupArgs，但没有相应的注释说明其用途和工作方式。为了提高代码的可读性和可维护性，建议添加必要的文档注释。
Comment on lines
+296
to
+300
| const __INTERNAL_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = api.config.ssr | ||
| ?.__INTERNAL_DO_NOT_USE_OR_YOU_WILL_BE_FIRED ?? { | ||
| pureApp: false, | ||
| pureHtml: false, | ||
| }; |
There was a problem hiding this comment.
关于 __INTERNAL_DO_NOT_USE_OR_YOU_WILL_BE_FIRED 的使用。
此变量的命名明显是为了警告开发者不要在其他地方使用这个内部变量，这是一个好的实践。但是，从维护和可读性角度来看，如果能在代码中添加更多关于此变量具体作用和使用场景的注释，将会更加有帮助。
Comment on lines
+644
to
+646
| exports.push( | ||
| `export type { History, ClientLoader } from '${rendererPath}'`, | ||
| ); |
There was a problem hiding this comment.
检查导出类型的正确性。
在这里导出了 History 和 ClientLoader 类型，但没有提供对应的导入语句。这可能会导致在其他使用这些类型的文件中出现找不到类型的错误。建议检查是否在文件的其他部分或相关依赖中正确导入了这些类型。
Comment on lines
+1
to
+23
| import { createCache, extractStyle, StyleProvider } from '@ant-design/cssinjs'; | ||
| import { useState } from 'react'; | ||
| import { Outlet, useServerInsertedHTML } from 'umi'; | ||
|
|
||
| export default function Layout() { | ||
| const [cssCache] = useState(() => createCache()); | ||
|
|
||
| useServerInsertedHTML(() => { | ||
| const style = extractStyle(cssCache, { plain: true }); | ||
| return ( | ||
| <style | ||
| id="antd-cssinjs" | ||
| dangerouslySetInnerHTML={{ __html: style }} | ||
| ></style> | ||
| ); | ||
| }); | ||
|
|
||
| return ( | ||
| <StyleProvider cache={cssCache}> | ||
| <Outlet /> | ||
| </StyleProvider> | ||
| ); | ||
| } |
There was a problem hiding this comment.
避免使用 dangerouslySetInnerHTML。
代码中使用了 dangerouslySetInnerHTML 来设置内联样式，这可能会导致跨站脚本攻击（XSS）。建议寻找其他方法来设置样式，以提高应用的安全性。
- <style id="antd-cssinjs" dangerouslySetInnerHTML={{ __html: style }}></style>
+ <style id="antd-cssinjs">{style}</style>Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
Suggested change
| import { createCache, extractStyle, StyleProvider } from '@ant-design/cssinjs'; | |
| import { useState } from 'react'; | |
| import { Outlet, useServerInsertedHTML } from 'umi'; | |
| export default function Layout() { | |
| const [cssCache] = useState(() => createCache()); | |
| useServerInsertedHTML(() => { | |
| const style = extractStyle(cssCache, { plain: true }); | |
| return ( | |
| <style | |
| id="antd-cssinjs" | |
| dangerouslySetInnerHTML={{ __html: style }} | |
| ></style> | |
| ); | |
| }); | |
| return ( | |
| <StyleProvider cache={cssCache}> | |
| <Outlet /> | |
| </StyleProvider> | |
| ); | |
| } | |
| import { createCache, extractStyle, StyleProvider } from '@ant-design/cssinjs'; | |
| import { useState } from 'react'; | |
| import { Outlet, useServerInsertedHTML } from 'umi'; | |
| export default function Layout() { | |
| const [cssCache] = useState(() => createCache()); | |
| useServerInsertedHTML(() => { | |
| const style = extractStyle(cssCache, { plain: true }); | |
| return ( | |
| <style id="antd-cssinjs">{style}</style> | |
| ); | |
| }); | |
| return ( | |
| <StyleProvider cache={cssCache}> | |
| <Outlet /> | |
| </StyleProvider> | |
| ); | |
| } |
Tools
Biome
[error] 13-13: Avoid passing content using the dangerouslySetInnerHTML prop. (lint/security/noDangerouslySetInnerHtml)
Setting content using code can expose users to cross-site scripting (XSS) attacks
Comment on lines
+32
to
+34
| dangerouslySetInnerHTML={{ | ||
| __html: `.server_inserted_style { color: #1677ff }`, | ||
| }} |
There was a problem hiding this comment.
避免使用 dangerouslySetInnerHTML
直接在组件内部使用 dangerouslySetInnerHTML 可能会增加跨站脚本攻击（XSS）的风险。建议使用更安全的方法来插入或更新页面内容。
Tools
Biome
[error] 32-32: Avoid passing content using the dangerouslySetInnerHTML prop. (lint/security/noDangerouslySetInnerHtml)
Setting content using code can expose users to cross-site scripting (XSS) attacks
Comment on lines
11
to
18
| return zod | ||
| .object({ | ||
| plugins: zod.object({ | ||
| load: zod.function(), | ||
| generateEnd: zod.function(), | ||
| }), | ||
| }) | ||
| .partial(); |
There was a problem hiding this comment.
Mako 配置和日志消息审查
文件中添加了 Mako 的新配置架构和对 Windows 兼容性的检查。此外，还增加了有关 Mako 开发状态的日志消息。建议改进日志消息，使其更清晰，并明确指出工具的开发状态。
- `Mako is an extremely fast, production-grade web bundler based on Rust. And it's still under active development and is not yet ready for production use. If you encounter any issues, please checkout https://makojs.dev/ to join the community and report the issue.`
+ `Mako is a high-performance web bundler based on Rust, currently under active development. It is not recommended for production use yet. For issues, join the community at https://makojs.dev/.`Also applies to: 25-29, 38-54
Comment on lines
+67
to
+69
| const html = await markupRender(path); | ||
| logger.info(`Pre-render for ${path}`); | ||
| return html; |
There was a problem hiding this comment.
优化错误处理
在进行预渲染时，如果遇到错误，代码会记录错误并可能抛出。建议在这里添加更详细的错误处理逻辑，例如错误重试或提供更详细的错误信息。
- logger.error(`Pre-render ${path} error: ${err}`);
- if (!ignorePreRenderError) {
+ logger.error(`Pre-render ${path} error: ${err}, attempting a retry...`);
+ try {
+ const html = await markupRender(path);
+ logger.info(`Retry successful for ${path}`);
+ return html;
+ } catch (retryErr) {
+ logger.error(`Retry failed for ${path}: ${retryErr}`);
+ if (!ignorePreRenderError) {
throw err;
+ }
+ }Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
Suggested change
| const html = await markupRender(path); | |
| logger.info(`Pre-render for ${path}`); | |
| return html; | |
| const html = await markupRender(path); | |
| logger.info(`Pre-render for ${path}`); | |
| return html; | |
| } catch (err) { | |
| logger.error(`Pre-render ${path} error: ${err}, attempting a retry...`); | |
| try { | |
| const html = await markupRender(path); | |
| logger.info(`Retry successful for ${path}`); | |
| return html; | |
| } catch (retryErr) { | |
| logger.error(`Retry failed for ${path}: ${retryErr}`); | |
| if (!ignorePreRenderError) { | |
| throw err; | |
| } | |
| } | |
| } |
Comment on lines
+16
to
+18
| dangerouslySetInnerHTML={{ | ||
| __html: `<b>Enable JavaScript to run this app.</b>`, | ||
| }} |
There was a problem hiding this comment.
避免使用 dangerouslySetInnerHTML
此处使用 dangerouslySetInnerHTML 可能会导致 XSS 攻击。建议找到替代的安全方式来实现此功能。
- dangerouslySetInnerHTML={{ __html: `<b>Enable JavaScript to run this app.</b>` }}
+ children={<b>Enable JavaScript to run this app.</b>}Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
Suggested change
| dangerouslySetInnerHTML={{ | |
| __html: `<b>Enable JavaScript to run this app.</b>`, | |
| }} | |
| children={<b>Enable JavaScript to run this app.</b>} |
Tools
Biome
[error] 16-16: Avoid passing content using the dangerouslySetInnerHTML prop. (lint/security/noDangerouslySetInnerHtml)
Setting content using code can expose users to cross-site scripting (XSS) attacks
Comment on lines
90
to
99
| if (memo.ssr.builder === 'mako') { | ||
| assert( | ||
| !memo.mako, | ||
| `The \`ssr.builder mako\` config is now allowed when \`mako\` is enable!`, | ||
| ); | ||
| memo.manifest ??= {}; | ||
| if (isWindows) { | ||
| memo.ssr.builder = 'webpack'; | ||
| } | ||
| } |
There was a problem hiding this comment.
Tip
Codebase Verification
配置校验
搜索结果显示在项目文档中没有找到关于 ssr.builder 和 mako 配置项的详细文档说明。建议在项目文档中添加这些配置项的必要性和用途的详细说明，以避免未来的误配置。
- 未找到关于
ssr.builder的详细文档说明。 - 未找到关于
mako的详细文档说明。
Analysis chain
配置校验
这里进行了一系列配置校验，确保配置的正确性。建议在文档中明确指出这些配置项的必要性和用途，避免未来的误配置。
Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Verify the necessity and usage of configuration items in the project documentation.
# Test: Search for documentation about the configuration items used in SSR setup. Expect: Detailed documentation should exist.
rg --type md "ssr.builder|mako"
Length of output: 124
Script:
#!/bin/bash
# Expand the search for detailed documentation about `ssr.builder` and `mako` in all Markdown files and any other potential documentation files.
# Search for mentions of `ssr.builder` in Markdown files
rg --type md "ssr.builder"
# Search for mentions of `mako` in Markdown files
rg --type md "mako"
# Search for detailed documentation in other potential documentation files (e.g., HTML, JSON, etc.)
rg --type html "ssr.builder|mako"
rg --type json "ssr.builder|mako"
Length of output: 332
| return ( | ||
| <html> | ||
| <head></head> | ||
| <body> |
There was a problem hiding this comment.
为 HTML 元素添加 lang 属性
出于无障碍访问性的考虑，应为 HTML 元素添加 lang 属性，这有助于屏幕阅读器正确地识别页面使用的语言。
- <html>
+ <html lang="en">Committable suggestion was skipped due to low confidence.
Tools
Biome
[error] 126-126: Provide a lang attribute when using the html element. (lint/a11y/useHtmlLang)
Setting a lang attribute on HTML document elements configures the languageused by screen readers when no user default is specified.
PeachScript
reviewed
Jun 25, 2024
| @@ -66,6 +66,7 @@ export function resolveDefine(opts: IOpts) { | |||
|
|
|||
| return { | |||
| 'process.env': env, | |||
| 'process.env.SSR_MANIFEST': 'process.env.SSR_MANIFEST', | |||
There was a problem hiding this comment.
忘了当时的情况了，这个能实现到 ssr plugin 里吗
|
|
||
| api.chainWebpack((config, { ssr }) => { | ||
| // 在 ssr 的场景下，把 qiankun external 到一个任意模块 | ||
| // 这样就不会把 qiankun 的依赖构建进产物中 |
There was a problem hiding this comment.
这里感觉还是得有个本质解，现在的方式只是绕过，注释里至少要包含两个问题：
- 为什么不能引入 qiankun 的依赖
- 为什么 ssr 没用到 qiankun 却又会把 qiankun 打进来
以及本质解应该是满足某个前提 ssr 就不受影响，也不用 externals 来绕，可以留成 TODO
| @@ -107,7 +107,12 @@ umi build --clean | |||
| react: { | |||
| runtime: shouldUseAutomaticRuntime ? 'automatic' : 'classic', | |||
| }, | |||
| config: api.config, | |||
| plugins: api.config.mako?.plugins, | |||
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
Files selected for processing (1)
- package.json (3 hunks)
Files skipped from review due to trivial changes (1)
- package.json
There was a problem hiding this comment.
Actionable comments posted: 3
Outside diff range and nitpick comments (4)
packages/preset-umi/src/commands/build.ts (2)
142-144: 处理环境变量的使用代码中使用了环境变量
process.env.OKAM来动态引入模块。这种做法虽然提供了灵活性，但也增加了代码的复杂性和潜在的错误风险。建议在文档中详细说明这种用法的场景和限制，以帮助开发者正确使用。
Line range hint
72-72: 避免使用 'Object' 作为类型代码中多次使用了 'Object' 作为类型，这种做法虽然简便，但会导致类型检查的不严格。建议使用更具体的类型定义，以提高代码的安全性和可维护性。
- const modifyWebpackConfig = async (memo: Object, args: Object) => { + const modifyWebpackConfig = async (memo: WebpackConfig, args: WebpackArgs) => {Also applies to: 80-80, 87-87
packages/preset-umi/src/features/ssr/ssr.ts (1)
Line range hint
176-193: 优化构建逻辑在处理不同构建工具的逻辑时，代码中使用了多个条件判断。这种做法虽然可以处理复杂的场景，但也使得代码难以阅读和维护。建议对构建逻辑进行抽象和封装，以简化代码结构。
- if (builder === 'esbuild') { - await esbuildBuilder.build({ - api, - watch: api.env === 'development', - }); - } else if (builder === 'webpack') { - assert( - !api.config.vite, - `The \`vite\` config is now allowed when \`ssr.builder\` is webpack!`, - ); - await webpackBuilder.build(api, opts); - } else if (api.config.mako && builder === 'mako') { - await makoBuiler.build(api); - } + await handleBuild(builder, api, opts);packages/preset-umi/src/commands/dev/dev.ts (1)
439-441: 处理环境变量的使用代码中使用了环境变量
process.env.OKAM来动态引入模块。这种做法虽然提供了灵活性，但也增加了代码的复杂性和潜在的错误风险。建议在文档中详细说明这种用法的场景和限制，以帮助开发者正确使用。
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (6)
- examples/ssr-demo/.umirc.ts (1 hunks)
- packages/preset-umi/src/commands/build.ts (5 hunks)
- packages/preset-umi/src/commands/dev/dev.ts (2 hunks)
- packages/preset-umi/src/features/mako/mako.ts (2 hunks)
- packages/preset-umi/src/features/ssr/mako/mako.ts (1 hunks)
- packages/preset-umi/src/features/ssr/ssr.ts (6 hunks)
Files skipped from review as they are similar to previous changes (3)
- examples/ssr-demo/.umirc.ts
- packages/preset-umi/src/features/mako/mako.ts
- packages/preset-umi/src/features/ssr/mako/mako.ts
Additional context used
Biome
packages/preset-umi/src/commands/build.ts
[error] 72-72: Don't use 'Object' as a type.
Prefer explicitly define the object shape. This type means "any non-nullable value", which is slightly better than 'unknown', but it's still a broad type.
(lint/complexity/noBannedTypes)
[error] 80-80: Don't use 'Object' as a type.
Prefer explicitly define the object shape. This type means "any non-nullable value", which is slightly better than 'unknown', but it's still a broad type.
(lint/complexity/noBannedTypes)
[error] 87-87: Don't use 'Object' as a type.
Prefer explicitly define the object shape. This type means "any non-nullable value", which is slightly better than 'unknown', but it's still a broad type.
(lint/complexity/noBannedTypes)
packages/preset-umi/src/features/ssr/ssr.ts
[error] 66-66: Avoid the delete operator which can impact performance.
Unsafe fix: Use an undefined assignment instead.
(lint/performance/noDelete)
packages/preset-umi/src/commands/dev/dev.ts
[error] 279-279: Don't use 'Object' as a type.
Prefer explicitly define the object shape. This type means "any non-nullable value", which is slightly better than 'unknown', but it's still a broad type.
(lint/complexity/noBannedTypes)
[error] 287-287: Don't use 'Object' as a type.
Prefer explicitly define the object shape. This type means "any non-nullable value", which is slightly better than 'unknown', but it's still a broad type.
(lint/complexity/noBannedTypes)
[error] 294-294: Don't use 'Object' as a type.
Prefer explicitly define the object shape. This type means "any non-nullable value", which is slightly better than 'unknown', but it's still a broad type.
(lint/complexity/noBannedTypes)
Comment on lines
+181
to
+193
| const args = await getMarkupArgs({ api }); | ||
|
|
||
| const finalMarkUpArgs = { | ||
| ...markupArgs, | ||
| styles: markupArgs.styles.concat( | ||
| ...args, | ||
| styles: args.styles.concat( | ||
| api.config.vite | ||
| ? [] | ||
| : [...(assetsMap['umi.css'] || []).map((src) => ({ src }))], | ||
| ), | ||
| scripts: (api.config.vite | ||
| ? [] | ||
| : [...(assetsMap['umi.js'] || []).map((src) => ({ src }))] | ||
| ).concat(markupArgs.scripts), | ||
| ).concat(args.scripts), |
There was a problem hiding this comment.
优化资源引用
在处理静态资源的路径时，代码尝试根据配置动态调整路径。这是一个复杂的逻辑，建议增加单元测试来确保路径计算的正确性。
是否需要帮助编写这部分的单元测试代码？
Comment on lines
+110
to
+113
| config: { | ||
| outputPath: api.userConfig.outputPath || 'dist', | ||
| ...api.config, | ||
| } as IServicePluginAPI['config'], |
There was a problem hiding this comment.
优化配置对象的定义方式
在配置对象的定义中，使用了扩展操作符来合并用户配置和默认配置。这种方式虽然便捷，但可能会导致意外的属性覆盖。建议明确指出每个属性的来源，以提高代码的可读性和可维护性。
- ...api.config,
+ outputPath: api.userConfig.outputPath || 'dist',
+ someOtherConfig: api.config.someOtherConfig,Committable suggestion was skipped due to low confidence.
| const oReactDom = memo.alias['react-dom']; | ||
|
|
||
| // put react-dom after react-dom/server | ||
| delete memo.alias['react-dom']; |
There was a problem hiding this comment.
避免使用 delete 操作符
代码中使用了 delete 操作符来处理对象属性，这可能会影响性能。建议使用其他方法来处理不需要的属性。
- delete memo.alias['react-dom'];
+ memo.alias['react-dom'] = undefined;Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
Suggested change
| delete memo.alias['react-dom']; | |
| memo.alias['react-dom'] = undefined; |
Tools
Biome
[error] 66-66: Avoid the delete operator which can impact performance.
Unsafe fix: Use an undefined assignment instead.
(lint/performance/noDelete)
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
Files selected for processing (1)
- packages/preset-umi/package.json (2 hunks)
Files skipped from review due to trivial changes (1)
- packages/preset-umi/package.json
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (3)
- packages/preset-umi/package.json (2 hunks)
- packages/renderer-react/package.json (1 hunks)
- packages/server/package.json (1 hunks)
Files skipped from review as they are similar to previous changes (3)
- packages/preset-umi/package.json
- packages/renderer-react/package.json
- packages/server/package.json
|
这个 PR 看起来质量很差，唉。 |
|
I tried to use qiankun on ssr mode but there is error. import { defineConfig } from 'umi' ;
export default defineConfig ({
ssr: { builder: 'webpack' },
exportStatic: {},
hash: true,
mfsu : false,
chainWebpack(memo) {
memo.output.libraryTarget('umd') ;
memo.output.library('ssr-webpack') ;
memo.output.chunkLoadingGlobal('webpackJsonp_ssr-webpack') ;
return memo ;
},
plugins: [
'@umijs/plugins/dist/qiankun',
],
qiankun: {
slave: {},
},
routes: [
{ path: '/', component: 'index' },
],
}) ;
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
新版 ssr 水合:
document节点开始hydrateserverLoader降级方案scripts、headScripts等配置注入mako构建Summary by CodeRabbit
新功能
ssr-demo项目中添加了Layout组件，使用@ant-design/cssinjs进行样式管理。ssr-demo项目中的Input组件和useId导入。依赖更新
react和react-dom版本从18.1.0更新到18.3.1。ssr-demo项目中添加了@ant-design/cssinjs依赖并更新antd版本。jest、lerna、typescript等。改进
window对象存在性的检查，以支持服务器端渲染（SSR）。qiankun插件的 SSR 处理逻辑，增加了条件判断。修复
definePlugin中的环境变量配置问题。modelUtils.test中的导入顺序和模板字符串缩进。通过这些更新，用户将在使用应用时体验到更稳定和高效的性能，同时新功能的引入将改善用户体验。