仅对TypeScript类型提供可选的对等项依赖关系?

时间:2019-09-03 15:24:20

标签: reactjs typescript npm redux react-redux

我有一个实现React组件的TypeScript库。可选功能之一是您可以将Redux存储的实例作为道具传递给组件以进行Redux集成。

<Component reduxStore={store}></Component>

这是一个可选的道具,该库仅从Redux包中导入Store类型以强制执行类型。我图书馆的不使用Redux的消费者将永远不需要这种依赖关系,并且不应将其捆绑在最终版本中。

当前,我将Redux软件包作为dependency包含在内,这会引起一些问题。在Redux中,类型包含在包中,但是Store类型在Redux库的最新版本中已更改。这意味着使用我的库和TypeScript并安装了自己的Redux版本作为依赖项的人可能会遇到库中安装的类型信息与库中安装的相同类型之间的类型不匹配。

这似乎是将依赖项列为对等依赖项的一个好例子,除了它是一项可选功能,如果不打算使用Redux集成功能,则不需要库的使用者安装Redux。

>

是否有更好的方法来处理库的类型信息,以使依赖版本之间的类型上的微小变化不会为我的库的使用者抛出类型不匹配错误?

我能想到的两个可能的解决方案是:

  1. reduxStore可选属性设置为键入any,并在使用预期在dispatch上使用的Store方法之前,进行空引用检查。这可能有效,但会降低在构建时捕获错误的能力。
  2. 也许有一种方法可以创建我自己的自定义Store接口,该接口仅强制实施我计划使用的方法的一小部分。
  3. 为想要与Redux集成以封装核心组件的人创建一个单独的程序包...在架构上这可能是一个巨大的麻烦。

1 个答案:

答案 0 :(得分:0)

我的建议是提供一个接受通用的可选HOC。您的用户可以用它包装您的组件。您关心的是不同的类型版本和绑定的依赖项。这意味着您别无选择,只能让用户决定他们使用什么类型。

const useStore:<Store = any> = (store: Store) => WrappedComponent => {
   return (props) => <WrappedComponent {...props} store={store} />
}

及其在组件中的实现如下所示:

import {Store} from 'react-redux
useStore<Store>(store)(Component)