jsDoc npm 模块任务

目前我正在工作/维护遗留的 js/react 应用程序，其中没有选项可以重新工作到 typesript，所以这就是为什么我打开 jsDoc 作为 JS 的现有开发时类型系统。

太长了；

Typescript npm 模块由 jsDoc 制作，useDuck 在 70LOC 下带回了 redux 的黄金时代。该模块在开发时的主要用例，帮助您的复杂状态保持类型安全。

const [state, quack] = useDuck(reducer, initialState, actionsMap);

jsdoc-duck

从 Typescript 到 jsDoc 之路

当我创建了一个轻量级的 React State npm 库时，我对 TypeScript 的体验更加深入了：react-state-factory

User declared 
state and actions types 
  -> useStateFactory 
  -> [state, dispatchedActoionCollection]

测试 jsDoc 限制

在我开始使用一些 jsDoc 注释来帮助我的工作之后，下一步有点更加大胆：将此模块重新设计为 jsDoc。乍一看，这是一项不可能完成的任务。但在花了几周时间了解 jsDoc 后，我看到了一些曙光。

恐怖类型系统：减速机

在某个点上，当我尝试编写一个reducer函数时，我发现了jsDoc能力的硬限制，结果是一个Quack，但当然它启动了一个空的{}。因此，只有reducer运行结束时才创建了正确的Quack，因为该类型对包含所有请求的键的对象感到好奇。所以这个问题到现在我都无法解决，如果有人能给我一个好主意，我该如何解决它，请与我分享或作为合作者加入这个模块开发。

另一个陷阱：没有 TS 的模块中没有类型

一开始我创建了一个 js 文件，其中包含所有必要的 jsDoc @typedef，迟早它会起作用。这就是我认为为他们创建节点模块的一步。
但可悲的事实是，包含导出类型的 npm 模块不能仅与 jsDoc 一起使用，因此必须编译 d.ts，因此最后 jsDoc 模块不要说 100% JS，而是构建也使用 typescript。

jsdoc-duck 模块中的@typedef

正如您在 dev.to 论坛中所认识到的，语法高亮无法识别 jsDoc。其他错误的事情在我的测试中，如果你只写一行，这个 @typedef 就会起作用，所以它违背了干净的代码。

在我的下一篇博文中，我将写的是这个库的具体用例，排序：使用 useReducer 简化和类型安全反应状态处理。

/**
 * @template T - Payload Type
 * @typedef {T extends { type: infer U, payload?: infer P } ? { type: U, payload?: P } : never} ActionType
 */

// @ts-ignore
/** @template AM - Actions Map @typedef {{ [K in AM['type']]: K }} Labels */

// @ts-ignore
/** @template AM - Actions Map @typedef {{ [T in AM["type"]]: Extract<AM, { type: T }> extends { payload: infer P } ? (payload: P) => void : () => void }} Quack */

/**
 * @template ST - State
 * @template AM - Actions Map
 * @typedef {(state: ST, action: AM) => ST} Reducer
 */

以上是jsDoc npm 模块任务的详细内容。更多信息请关注PHP中文网其他相关文章！