dumi
dumi copied to clipboard
bug: 升级 rc-4 之后,渲染有自动 API 的文档时报错
API.tsx:38 Uncaught TypeError: Cannot read property 'map' of undefined
at push../node_modules/dumi-theme-default/src/builtins/API.tsx.__webpack_exports__.default (API.tsx:38)
at renderWithHooks (react-dom.development.js:14803)
at mountIndeterminateComponent (react-dom.development.js:17482)
at beginWork (react-dom.development.js:18596)
at HTMLUnknownElement.callCallback (react-dom.development.js:188)
at Object.invokeGuardedCallbackDev (react-dom.development.js:237)
at invokeGuardedCallback (react-dom.development.js:292)
at beginWork$1 (react-dom.development.js:23203)
at performUnitOfWork (react-dom.development.js:22154)
at workLoopSync (react-dom.development.js:22130)
at performSyncWorkOnRoot (react-dom.development.js:21756)
at react-dom.development.js:11089
at unstable_runWithPriority (scheduler.development.js:653)
at runWithPriority$1 (react-dom.development.js:11039)
at flushSyncCallbackQueueImpl (react-dom.development.js:11084)
at flushSyncCallbackQueue (react-dom.development.js:11072)
at scheduleUpdateOnFiber (react-dom.development.js:21199)
at dispatchAction (react-dom.development.js:15660)
at checkForUpdates (use-subscription.development.js:87)
at index.esm.js:674
at Set.forEach (<anonymous>)
at LoadableSubscription._update (index.esm.js:673)
at index.esm.js:656
push../node_modules/dumi-theme-default/src/builtins/API.tsx.__webpack_exports__.default @ API.tsx:38
renderWithHooks @ react-dom.development.js:14803
mountIndeterminateComponent @ react-dom.development.js:17482
beginWork @ react-dom.development.js:18596
callCallback @ react-dom.development.js:188
invokeGuardedCallbackDev @ react-dom.development.js:237
invokeGuardedCallback @ react-dom.development.js:292
beginWork$1 @ react-dom.development.js:23203
performUnitOfWork @ react-dom.development.js:22154
workLoopSync @ react-dom.development.js:22130
performSyncWorkOnRoot @ react-dom.development.js:21756
(anonymous) @ react-dom.development.js:11089
unstable_runWithPriority @ scheduler.development.js:653
runWithPriority$1 @ react-dom.development.js:11039
flushSyncCallbackQueueImpl @ react-dom.development.js:11084
flushSyncCallbackQueue @ react-dom.development.js:11072
scheduleUpdateOnFiber @ react-dom.development.js:21199
dispatchAction @ react-dom.development.js:15660
checkForUpdates @ use-subscription.development.js:87
(anonymous) @ index.esm.js:674
_update @ index.esm.js:673
(anonymous) @ index.esm.js:656
Promise.then (async)
retry @ index.esm.js:655
LoadableSubscription @ index.esm.js:610
init @ index.esm.js:519
LoadableComponent @ index.esm.js:560
renderWithHooks @ react-dom.development.js:14803
updateForwardRef @ react-dom.development.js:16816
beginWork @ react-dom.development.js:18645
beginWork$1 @ react-dom.development.js:23179
performUnitOfWork @ react-dom.development.js:22154
workLoopSync @ react-dom.development.js:22130
performSyncWorkOnRoot @ react-dom.development.js:21756
(anonymous) @ react-dom.development.js:11089
unstable_runWithPriority @ scheduler.development.js:653
runWithPriority$1 @ react-dom.development.js:11039
flushSyncCallbackQueueImpl @ react-dom.development.js:11084
flushSyncCallbackQueue @ react-dom.development.js:11072
discreteUpdates$1 @ react-dom.development.js:21893
discreteUpdates @ react-dom.development.js:806
dispatchDiscreteEvent @ react-dom.development.js:4168
devScripts.js:5836 The above error occurred in one of your React components:
in Unknown (at box.zh-CN.md:21)
in div (at box.zh-CN.md:18)
in Unknown (created by LoadableComponent)
in LoadableComponent (created by Context.Consumer)
in Route (created by Context.Consumer)
in Switch (created by Context.Consumer)
in component (created by Context.Consumer)
in div (at layout.tsx:82)
in div (at layout.tsx:61)
in Layout (at layout.tsx:34)
in div (at layout.tsx:33)
in Layout (created by LoadableComponent)
in LoadableComponent (created by Context.Consumer)
in OuterLayout (created by LoadableComponent)
in LoadableComponent (created by Context.Consumer)
in Route (created by RouterComponent)
in Switch (created by RouterComponent)
in Router (created by RouterComponent)
in RouterComponent
Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://fb.me/react-error-boundaries to learn more about error boundaries.
console.<computed> @ devScripts.js:5836
overrideMethod @ react_devtools_backend.js:2430
logCapturedError @ react-dom.development.js:19527
logError @ react-dom.development.js:19564
update.callback @ react-dom.development.js:20708
callCallback @ react-dom.development.js:12490
commitUpdateQueue @ react-dom.development.js:12511
commitLifeCycles @ react-dom.development.js:19883
commitLayoutEffects @ react-dom.development.js:22803
callCallback @ react-dom.development.js:188
invokeGuardedCallbackDev @ react-dom.development.js:237
invokeGuardedCallback @ react-dom.development.js:292
commitRootImpl @ react-dom.development.js:22541
unstable_runWithPriority @ scheduler.development.js:653
runWithPriority$1 @ react-dom.development.js:11039
commitRoot @ react-dom.development.js:22381
finishSyncRender @ react-dom.development.js:21807
performSyncWorkOnRoot @ react-dom.development.js:21793
(anonymous) @ react-dom.development.js:11089
unstable_runWithPriority @ scheduler.development.js:653
runWithPriority$1 @ react-dom.development.js:11039
flushSyncCallbackQueueImpl @ react-dom.development.js:11084
flushSyncCallbackQueue @ react-dom.development.js:11072
scheduleUpdateOnFiber @ react-dom.development.js:21199
dispatchAction @ react-dom.development.js:15660
checkForUpdates @ use-subscription.development.js:87
(anonymous) @ index.esm.js:674
_update @ index.esm.js:673
(anonymous) @ index.esm.js:656
Promise.then (async)
retry @ index.esm.js:655
LoadableSubscription @ index.esm.js:610
init @ index.esm.js:519
LoadableComponent @ index.esm.js:560
renderWithHooks @ react-dom.development.js:14803
updateForwardRef @ react-dom.development.js:16816
beginWork @ react-dom.development.js:18645
beginWork$1 @ react-dom.development.js:23179
performUnitOfWork @ react-dom.development.js:22154
workLoopSync @ react-dom.development.js:22130
performSyncWorkOnRoot @ react-dom.development.js:21756
(anonymous) @ react-dom.development.js:11089
unstable_runWithPriority @ scheduler.development.js:653
runWithPriority$1 @ react-dom.development.js:11039
flushSyncCallbackQueueImpl @ react-dom.development.js:11084
flushSyncCallbackQueue @ react-dom.development.js:11072
discreteUpdates$1 @ react-dom.development.js:21893
discreteUpdates @ react-dom.development.js:806
dispatchDiscreteEvent @ react-dom.development.js:4168
Versions
- dumi: ^1.1.0-rc.4
- node:
- npm:
- OS:
- Browser:
Steps to reproduce
What is Expected?
What is actually happening?
请提供复现步骤或 repo
代码是内部的,不太方便公开,现在锁定到比较小的复现步骤如下
- .md 文档中使用 ts 文件作为 API src,如
<API src="./button/api.ts" /> - api.ts 文件中,从其他库导入了组件,进行了适当的筛选和名称修正,然后重新导出,如
// @ts-nocheck
import { Button } from 'xxx';
export const _Button = Button;
_Button.displayName = 'Button';
export const _Group = Button.Group;
_Group.displayName = 'Button.Group';
- 观察到,如果对 displayName 的设置,就可以工作。但是原封不动的代码,在 rc-2 的上是可以正确运行的
缩小范围,更新到 rc.3就不行了
浏览了一下 rc2 -> rc3,确实涉及到 parse api 的相关改动,不知道是不是产生了某些问题
https://github.com/umijs/dumi/compare/[email protected]@1.1.0-rc.3
或者,能否了解下,如何暴露 npm 包中的组件的 API 而不是项目中新写的,但同时合理的控制暴露哪些模块,每个模块按什么名字来展示?
导出的组件没写 displayName,或者没和组件名一致,都会有渲染错误问题
dumi v1 不再更新,issue 关闭