Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: 提供隐藏第三方prop的配置 #513

Closed
mini0609 opened this issue Jan 24, 2021 · 12 comments
Closed

feat: 提供隐藏第三方prop的配置 #513

mini0609 opened this issue Jan 24, 2021 · 12 comments
Labels
enhancement New feature or request

Comments

@mini0609
Copy link

Description

开发的组件是基于antd的,组件需要透传antd的prop,比如

import {Button} from 'antd'
import {ButtonProps} from 'antd/es/button'
type Props = ButtonProps & {
      myProp: string
}
const MyButton = (Props) => <Button>button</Button>

在使用的时候,希望不显示antd的buttonProps,太多了

Solution

在config.js里面增加react-docgen-typescript的配置,或者useApiData 返回的data标识属性是否是第三方库的prop

@mini0609 mini0609 added the enhancement New feature or request label Jan 24, 2021
YingJiangHui added a commit to YingJiangHui/neat-ui-react that referenced this issue Jun 20, 2021
原因:
1. react-docgen-typescript 依赖不支持 typescript@v4.3.2+
issue url:styleguidist/react-docgen-typescript#356

2. dumi 暂时没有开放对react-docgen-typescript过滤功能的配置
issue url:umijs/dumi#513
@sdhr27
Copy link
Contributor

sdhr27 commented Jul 28, 2021

@PeachScript 现在还有计划支持么?

@PeachScript
Copy link
Member

@sdhr27 短时间内比较难,近期 API 相关功能没精力迭代了,有兴趣的话可以 PR 支持

@sdhr27
Copy link
Contributor

sdhr27 commented Jul 28, 2021

@sdhr27 短时间内比较难,近期 API 相关功能没精力迭代了,有兴趣的话可以 PR 支持

正有此意,我研究一下,做成全局忽略node_modules,然后支持局部propFilter怎么样?

@PeachScript
Copy link
Member

@sdhr27 我没有细想过,之前的一些想法供参考:

  1. 默认行为改进:过滤 HTML 标签属性
  2. 新增 API:
    a. excludes string[]:过滤匹配到的属性,可以支持正则
    b. ignoreNodeModules boolean:忽略 node_modules 下继承来的属性

直接全局忽略 node_modules 会有 Breaking Change;另外也可以看下 react-docgen-typescript 有没有能直接暴露给用户的配置项

@sdhr27
Copy link
Contributor

sdhr27 commented Aug 3, 2021

@PeachScript 有3个问题想请教一下~
1、如果直接过滤HTML标签属性的话,那么每个md文件都要单独设置过滤规则,所以我想再弄一份配置文件来配置propFilter,比如在.umirc里加一个配置项,类似react-docgen-typescript的styleguide.config.js那样,支持批量配置的话就好了。
2、过滤HTML标签属性时,string[]类型在解析/传入时都比较反直觉,是否可以考虑改为输入一个长字符串,用逗号分割?
3、dumi是一个lerna风格的库,如果我想调试效果,直接build + yarn link packages/dumi好像有问题,只能通过创建一个别名库发布再调试,想请教下有没有更好的调试方法。

@PeachScript
Copy link
Member

@sdhr27

  1. 有道理,全局配置应该是用户更需要的,可以加个 apiParser 的配置项做全局配置?
  2. 逗号分隔的字符串意味着要做内部转换,但用户的输入可能会出现各种异常(例如全角、多了空格等),字符串数组相对更严谨
  3. 可以直接用 dumi 的仓库做调试,link 调试也是可以的,如果 yarn link 或者 npm link 不好使,可以直接 ln -s /path/to/packages/dumi /path/to/project/node_modules 建个软连接做调试

@sdhr27
Copy link
Contributor

sdhr27 commented Aug 3, 2021

@PeachScript
1、在尝试添加全局配置时出现了如下报错,这块好像是umi不让加配置项?
image
2、ln命令执行需要安装什么包么?我这边npm install -g ln好像不行。

@sdhr27
Copy link
Contributor

sdhr27 commented Aug 3, 2021

@PeachScript
1、在尝试添加全局配置时出现了如下报错,这块好像是umi不让加配置项?
image
2、ln命令执行需要安装什么包么?我这边npm install -g ln好像不行。

问题1的解决方案是否是在features下添加apiParser的定义?
packages\preset-dumi\src\plugins\features\apiParser.ts

@sdhr27
Copy link
Contributor

sdhr27 commented Aug 4, 2021

关于调试:@PeachScript
我在dumi根目录下执行yarn build后,在packages/dumi中执行yarn link,然后在我的项目中执行yarn link dumi后,执行yarn start,出现了大量如下报错:
image
是还需要执行什么其他步骤么?

@PeachScript
Copy link
Member

@sdhr27 报错的原因是因为 dumi 默认对项目外的文件不走 babel 编译,在项目里再 link 下 dumi-theme-default 试试看

昨天的评论看漏了,ln 是系统命令但在 Windows 下不支持,Power Shell 应该可以用这个命令

@sdhr27
Copy link
Contributor

sdhr27 commented Aug 5, 2021

@PeachScript link了dumi-theme-default还是不行,报一样的错误。

原来ln是系统命令,难怪用不了,我再试试,感谢指导~

@PeachScript
Copy link
Member

PeachScript commented Aug 13, 2021

感谢 @sdhr27 ,v1.1.25 已支持 apiParser.propFilter 配置项,参考:https://d.umijs.org/zh-CN/config#apiparser

YingJiangHui added a commit to YingJiangHui/neat-ui-react that referenced this issue Sep 21, 2021
原因:
1. react-docgen-typescript 依赖不支持 typescript@v4.3.2+
issue url:styleguidist/react-docgen-typescript#356

2. dumi 暂时没有开放对react-docgen-typescript过滤功能的配置
issue url:umijs/dumi#513
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

3 participants