Skip to content

Commit e1199b8

Browse files
authored
docs(react-docgen): add some limit and more info (#5409)
1 parent 4df6c87 commit e1199b8

File tree

2 files changed

+40
-3
lines changed

2 files changed

+40
-3
lines changed

Diff for: packages/document/module-doc/docs/en/guide/basic/use-module-doc.mdx

+20-1
Original file line numberDiff line numberDiff line change
@@ -245,7 +245,20 @@ export const Button = (props?: ButtonProps) => {};
245245
```
246246

247247
The above is a standard writeup where `ButtonProps` will be extracted into the table and `Button` will be the title of the table.
248-
If you use the default export, the filename will be used as the form title. The generated content is as follows:
248+
If you use the default export, the filename will be used as the form title.
249+
250+
Notice that export features declared elsewhere are not available.
251+
252+
```tsx
253+
const A = () => {};
254+
255+
export { A }; // wrong
256+
export default A; // wrong
257+
export const B = () => {}; // right
258+
export default () => {}; // right
259+
```
260+
261+
The generated content is as follows:
249262

250263
```mdx
251264
### ButtonTest
@@ -267,6 +280,12 @@ If React types are used in Props, you need to add the types in tsconfig.json, ot
267280
}
268281
```
269282

283+
The best way is that you import the type directly:
284+
285+
```tsx
286+
import { FC } from 'react';
287+
```
288+
270289
:::
271290

272291
- `documentation` is used in tool library scenarios to parse JSDoc annotations.

Diff for: packages/document/module-doc/docs/zh/guide/basic/use-module-doc.mdx

+20-2
Original file line numberDiff line numberDiff line change
@@ -239,8 +239,20 @@ export type ButtonProps = {
239239
export const Button = (props?: ButtonProps) => {};
240240
```
241241

242-
上面是一个标准写法,其中 `ButtonProps` 将被提取至表格中, `Button` 作为表格的标题。
243-
如果使用默认导出,文件名将作为表格标题。生成的内容如下:
242+
上面是一个标准写法,其中 `ButtonProps` 将被提取至表格中, `Button` 作为表格的标题。如果使用默认导出,文件名将作为表格标题。
243+
244+
需要注意的是,export 导出事先定义的特性将不会被解析。
245+
246+
```tsx
247+
const A = () => {};
248+
249+
export { A }; // wrong
250+
export default A; // wrong
251+
export const B = () => {}; // right
252+
export default () => {}; // right
253+
```
254+
255+
生成的内容如下:
244256

245257
```mdx
246258
### ButtonTest
@@ -262,6 +274,12 @@ export const Button = (props?: ButtonProps) => {};
262274
}
263275
```
264276

277+
更好的方式是直接引用类型,例如
278+
279+
```tsx
280+
import { FC } from 'react';
281+
```
282+
265283
:::
266284

267285
- `documentation`适用于工具库场景,用来解析 JSDoc 注释。

0 commit comments

Comments
 (0)