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

Is there a standard way to document Svelte components?

我来自 JavaDocs 的世界,喜欢在一定程度的复杂性之后处理带有完整注释的应用程序的 DX。

能够通过一些简短的文档将鼠标悬停在组件上并查看组件的所有属性(和隐含类型)将为我节省很多时间,而不必打开并通读整个组件。更好的是,运行 一个生成文档站点的命令就像您使用 JavaDocs 一样会很酷!

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

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

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

两者看起来都很有趣,同时采用完全不同的方法来解决应用程序文档问题。也许仍有空间为 SvelteDoc 解析器构建一个基于 CLI 的站点生成器,它可以变成一个 VS 代码插件!

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

<!--
  @component

  some markdown here
-->

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

编辑:

仍然找不到 @component 评论功能的官方文档,但意识到它确实在常见问题解答中有所描述:https://svelte.dev/faq#how-do-i-document-my-components 这些信息是否属于实际文档?也许吧。

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

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

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