Bogdan-Lyashenko/js-code-to-svg-flowchart

这是什么？

核心功能

• 01将 JavaScript（ES6）代码转换为 SVG 流程图，可在浏览器或 Node.js 中运行。
• 02提供命令行工具，可对本地 JS 文件直接生成 SVG。
• 03内置 import/export、类与函数依赖等抽象层级。
• 04支持自定义抽象层级和流程树修饰器。
• 05支持对图中节点或分支进行聚焦、模糊和代码块折叠。
• 06内置多种配色主题，并支持自定义样式。

适用场景

• 用流程图为模块或函数的工作方式编写文档。
• 通过可视化控制流，逐步理解不熟悉的代码库。
• 生成从高层结构到细节逻辑的演示幻灯片。
• 为用合法 JS 语法描述的业务流程绘制流程图。

快速上手

1. 1

   从 NPM 安装该包

   yarn add js2flowchart
2. 2

   全局安装以便在任意位置使用命令行工具

   yarn global add js2flowchart
3. 3

   从 JS 文件生成 SVG 流程图

   js2flowchart main.js

使用前须知

• !仓库说明多文件支持由另一个项目 Codecrumbs 提供，而非本库。
• !最近一次代码推送在 2023 年 10 月，维护可能较慢。
• !README 未说明在示例之外的代码生成流程图的效果。

标签

常见问题

js-code-to-svg-flowchart 是什么？

将 JavaScript 代码转换为 SVG 流程图的库与命令行工具，支持抽象层级、代码块修饰和主题定制。 js2flowchart 将 JavaScript 代码解析为抽象语法树，再生成流程树，并渲染为 SVG 流程图。它可在浏览器和 Node.js 环境中运行，支持 ES6 语法，既可通过 JavaScript API 调用，也可用命令行对单个文件生成 SVG。

js-code-to-svg-flowchart 可以免费使用吗？用的什么许可证？

js-code-to-svg-flowchart 以 MIT 许可证开源。用于商业产品前，请先确认许可证条款。

js-code-to-svg-flowchart 还在维护吗？

超过半年未提交。js-code-to-svg-flowchart 最近一次提交是在 2023年10月2日。

js-code-to-svg-flowchart 适合用来做什么？

用流程图为模块或函数的工作方式编写文档。 通过可视化控制流，逐步理解不熟悉的代码库。 生成从高层结构到细节逻辑的演示幻灯片。 为用合法 JS 语法描述的业务流程绘制流程图。

js-code-to-svg-flowchart 怎么安装和运行？

从 NPM 安装该包: yarn add js2flowchart 全局安装以便在任意位置使用命令行工具: yarn global add js2flowchart 从 JS 文件生成 SVG 流程图: js2flowchart main.js

在哪里获取 js-code-to-svg-flowchart？

源代码和安装说明在 GitHub 上：https://github.com/Bogdan-Lyashenko/js-code-to-svg-flowchart