Validate and visualize dependencies. Your rules. JavaScript, TypeScript, CoffeeScript. ES6, CommonJS, AMD.

This repository is empty

Auto Translate

Dependency cruiser

验证和可视化依赖关系。按照您的规则。 JavaScript、TypeScript、CoffeeScript。ES6、CommonJS、AMD。

它能做什么？

精美的 dot 输出，让您一睹为快

它会遍历任何 JavaScript、TypeScript、LiveScript 或 CoffeeScript 项目中的依赖关系，并...

...根据（您自己的）规则** 验证**它们
...** 报告**违反的规则
- 文本形式（用于构建过程）
- 图形形式（直观查看）

作为附加功能，它可以生成多种输出格式的依赖关系图，包括可以贴在墙上向您的奶奶炫耀的** 酷炫可视化效果**。

如何使用？

安装它...

npm install --save-dev dependency-cruiser
# or
yarn add -D dependency-cruiser
pnpm add -D dependency-cruiser

... 并生成配置

npx depcruise --init

这会在你的环境中稍作探查，询问你一些问题，然后创建一个适合你项目的 .dependency-cruiser.js 配置文件^[1]^[2]。

简单直观，老少咸宜

要创建 src 文件夹中依赖关系的图表，你可以使用输出类型为 dot 的 dependency-cruiser，并对结果运行 GraphViz dot^[3]。一行命令即可完成：

npx depcruise src --include-only "^src" --output-type dot | dot -T svg > dependency-graph.svg

dependency-cruiser v12 及更早版本：添加 --config 选项

虽然在 dependency-cruiser v13 及更高版本中无需此操作，但在 v12 及更早版本中，您必须传递 --config 选项才能让它找到 .dependency-cruiser.js 配置文件：
npx depcruise src --include-only "^src" --config --output-type dot | dot -T svg > dependency-graph.svg

您可以在命令行界面文档中了解有关 --include-only 和其他命令行选项的更多用法。
真实世界示例 包含了 npm 上一些最常用项目的依赖关系巡航结果。
如果您更倾向于 mermaid、json、csv、html 或纯文本等格式，我们也为您提供了支持。

验证内容

声明一些规则

当您在上面运行 depcruise --init 时，该命令还会向 .dependency-cruiser.js 中添加一些在大多数项目中都有用的规则，例如检测循环依赖、缺失于 package.json 中的依赖、孤立文件以及生产代码依赖 devDependencies 或 optionalDependencies 的情况。

通过调整该文件开始添加您自己的规则。

示例规则：

{
  "forbidden": [
    {
      "name": "not-to-test",
      "comment": "don't allow dependencies from outside the test folder to test",
      "severity": "error",
      "from": { "pathNot": "^test" },
      "to": { "path": "^test" }
    }
  ]
}

要了解更多关于编写规则的内容，请查看编写规则教程或规则参考

报告问题

npx depcruise src

dependency-cruiser v12 及更早版本：添加 --config 选项

虽然在 dependency-cruiser v13 及以上版本中无需此操作，但在 v12 及更早版本中，您必须传递 --config 选项才能让它找到 .dependency-cruiser.js 配置文件：
npx depcruise --config .dependency-cruiser.js src

这将根据您的规则进行验证，并以类似 eslint 的格式显示任何违规情况：

sample err output

还有更多验证报告方式；可以生成图表（如本 README 顶部的图表）或独立的 html 文件。

有关 err、dot、csv 和 html 报告器的更多信息，请参阅命令行界面文档。
dependency-cruiser 在其自身的构建过程中使用自身进行检查；请参见 package.json 中的 depcruise 脚本。

我想了解更多！

您来对地方了 😃：

许可协议

MIT

致谢

Marijn Haverbeke 以及所有参与 acorn 项目的贡献者——dependency-cruiser 使用这款优秀的 JavaScript 解析器来推断依赖关系。
unDraw 的 Katerina Limpitsouni，为 dependency-cruiser 的社交媒体图片提供了 Ollie 形象。
所有开源社区成员，感谢你们热心提出问题、参与讨论并提交代码，帮助 dependency-cruiser 不断完善。

构建状态

用 🤘 打造于荷兰。

为方便起见，我们在示例脚本中使用 npx。当你在 package.json 的脚本中使用这些命令时，无需在它们前面加上 npx。 ↩︎
如果你不想使用 npx，而是想使用 pnpx（来自 pnpm 包管理器）或 yarn，请参考相应工具的文档。特别是 pnpx，其语义与 npx 有很大不同，在使用前你需要了解这些差异。不过，在此期间：即使你使用 npm 以外的包管理器安装依赖，npx 也应该能正常工作。 ↩︎
这假设系统中已安装 GraphViz 的 dot 命令——在大多数 Linux 及类似系统上通常会预装。如果未安装，请参阅 GraphViz 下载页面了解如何在您的计算机上安装它。 ↩︎