使用 TypeDoc 的文档接口答案

【问题标题】：Document interfaces using TypeDoc使用 TypeDoc 的文档接口
【发布时间】：2023-03-27 15:45:02
【问题描述】：

我正在使用 TypeDoc 来记录我的 TypeScript 代码，就像这样：

/**
 * @param timestampValue Date in timestamp format
 */
const getDaysInTimestamp = (timestampValue: number): number => {
  return Math.round(timestampValue / 1000)
}

问题是我使用这样的 React 功能组件：

interface Props {
  useLocalStorage?: boolean
  useCookies?: boolean
}

const Application: React.FunctionComponent<Props> = (props) => {
  return (
    <>
      ...
    </>
  )
}

所以你可以像这样使用它：

<Application useLocalStorage useCookies >
  ...
</Application>

但使用这种结构，我无法详细记录Application 的props。我能做的最好的就是：

/**
 * @param props Props from Application component
 */
const Application: React.FunctionComponent<Props> = (props) => {
  ...

我尝试使用这种类型的符号，但它不受支持：

/**
 * @param props.useLocalStorage Enable the component to store some data in the localStorage
 * @param props.useCookies Enable the component to store and read cookies
 */
const Application: React.FunctionComponent<Props> = (props) => {
  ...

所以我最后的机会是直接记录界面。我的问题是：有没有办法为接口的每个属性编写 TypeDoc？也许类似的东西：

/**
 * @param useLocalStorage Enable the component to store some data in the localStorage
 * @param useCookies Enable the component to store and read cookies
 */
interface Props {
  useLocalStorage?: boolean
  useCookies?: boolean
}

你知道它是如何实现的吗？

【问题讨论】：

标签： reactjs typescript typedoc

【解决方案1】：

您可以向接口添加类型注释，类似于为类添加类型注释。

interface Props {
  /** Enable the component to store some data in the localStorage */
  useLocalStorage?: boolean

  /** Enable the component to store and read cookies */
  useCookies?: boolean
}

@typeparam 选项也可用于描述泛型类型，但我不确定它是否支持 Props.useLocalStorage 语法。

/**
 * @typeParam T  Comment for type `T`.
 * You may also use the template tag.
 * @template T comment for type `T`.
 */
function doSomething<T>(target: T, text: string): number;

【讨论】：