是否有记录 Svelte 组件的标准方法？

Posted 2023-02-19

【中文标题】是否有记录 Svelte 组件的标准方法？

【英文标题】：Is there a standard way to document Svelte components?

【发布时间】：2020-09-19 08:25:22

【问题描述】：

我来自 JavaDocs 世界，并且喜欢在经过一定程度的复杂性之后处理完全注释的应用程序的 DX。

能够通过一些简短的文档将鼠标悬停在组件上并查看组件的所有道具（和隐含类型），这将节省我很多时间，而不必打开并阅读整个组件。更好的是，运行一个命令来生成一个文档站点，就像你可以使用 JavaDocs 一样！

是否有围绕创建 SvelteDocs 构建的任何标准或工具？我浏览了 VS Code 市场，没有看到任何与 Svelte 相关的文档工具。

【问题讨论】：

如果他们能加点东西那就太好了。

【参考方案1】：

经过更多挖掘，我发现只有几个用于记录 Svelte 的项目。

SvelteDoc Parser -- 采用 VueDoc 方法，基于 JSDoc 标准，为 Svelte 组件生成 JSON 文档 Svelte-Docs -- Markdown 文档结合 Svelte 的特性，可以在生成的文档页面中嵌入组件

在采用完全不同的方法来解决应用程序文档问题时，两者看起来都很有趣。也许还有空间为 SvelteDoc Parser 构建基于 CLI 的站点生成器，它可以变成 VS Code 插件！

【参考方案2】：

我偶然发现了这个问题，以寻找我一直在使用的悬停/窥视文档方法的更深入的文档。它似乎没有很好的文档记录（具有讽刺意味），但它是 Svelte 语言工具的一部分，我已经在 Svelte for VS Code 中使用了一段时间，所以我确信在某些时候会有更多的文档。它的使用方式在您的组件中如下所示。我记得在某处读到它需要成为组件中的第一件事，但我再也找不到那个来源了。

<!--
  @component

  some markdown here
-->

由于某些原因，我能找到的唯一文档是here。但它提供了非常好的降价支持，因此您可以为您的组件制作一些非常有用的悬停/查看文档。

【参考方案3】：

很难找到一个好的。我推荐

https://github.com/carbon-design-system/sveld

看起来很有希望。它提供 Typescript 定义、JSON 和 Markdown 的导出功能。在我看来，只剩下一个严重的错误（Markdown 生成），所以希望它可以很快被使用。