Dependency-Cruiser 配置选项详解
概述
Dependency-Cruiser 是一款强大的 JavaScript/TypeScript 依赖关系分析工具,它可以帮助开发者可视化项目中的模块依赖关系,并检测潜在的依赖问题。本文将深入解析 Dependency-Cruiser 的各项配置选项,帮助开发者更好地利用这一工具。
过滤器选项
doNotFollow:不继续追踪特定模块的依赖
doNotFollow
选项允许你指定某些模块虽然会出现在报告中,但不会继续追踪它们的依赖关系。这在分析大型项目时特别有用,可以避免深入追踪不关心的模块(如 node_modules)。
{
"options": {
"doNotFollow": {
"path": "node_modules"
}
}
}
高级用法:你还可以通过 dependencyTypes
来限制不追踪的依赖类型,例如只忽略 npm 依赖:
{
"options": {
"doNotFollow": {
"dependencyTypes": ["npm", "npm-dev"]
}
}
}
includeOnly:仅包含匹配特定模式的模块
includeOnly
选项让你可以只关注项目中特定部分的模块。例如,如果你只想分析 src 目录下的代码:
{
"options": {
"includeOnly": "^src/"
}
}
focus:聚焦特定模块及其直接关联模块
focus
选项不仅会显示匹配的模块,还会显示它们的直接依赖和被依赖关系。这对于分析特定功能模块的交互特别有用。
{
"options": {
"includeOnly": "^src/",
"focus": "^src/main/"
}
}
深度控制:通过 depth
参数可以控制显示多少层关联关系:
{
"options": {
"focus": {
"path": "^src/main/",
"depth": 2
}
}
}
reaches:显示能够到达特定模块的所有路径
reaches
选项会显示所有能够(直接或间接)访问到指定模块的依赖路径,非常适合进行影响分析。
{
"options": {
"includeOnly": "^src/report",
"reaches": "^src/report/utl/index.js"
}
}
highlight:高亮显示特定模块
highlight
选项不会过滤任何模块,但会为匹配的模块添加特殊标记,便于在可视化报告中突出显示。
{
"options": {
"highlight": "^src/core/"
}
}
exclude:排除特定模块
exclude
选项可以完全排除某些模块不被分析:
{
"options": {
"exclude": {
"path": "node_modules"
}
}
}
collapse:按文件夹层级或模式汇总
collapse
选项可以将模块按文件夹层级或特定模式进行汇总显示,简化复杂项目的可视化。
{
"options": {
"collapse": "^node_modules/"
}
}
maxDepth:限制分析深度
maxDepth
选项限制从入口模块开始的依赖分析深度:
{
"options": {
"maxDepth": 2
}
}
环境匹配选项
moduleSystems:支持的模块系统
指定 Dependency-Cruiser 应该识别的模块系统类型:
{
"options": {
"moduleSystems": ["es6", "cjs", "amd"]
}
}
tsConfig:TypeScript 配置
指定 TypeScript 配置文件路径:
{
"options": {
"tsConfig": {
"fileName": "./tsconfig.json"
}
}
}
babelConfig:Babel 配置
指定 Babel 配置文件路径:
{
"options": {
"babelConfig": {
"fileName": "./.babelrc"
}
}
}
webpackConfig:Webpack 配置
指定 Webpack 配置文件路径:
{
"options": {
"webpackConfig": {
"fileName": "./webpack.config.js"
}
}
}
报告选项
主题定制
为不同报告类型定制主题:
{
"options": {
"reporterOptions": {
"dot": {
"theme": {
"graph": {
"splines": "ortho"
},
"modules": [
{
"criteria": { "matchesFocus": true },
"attributes": {
"fillcolor": "lime"
}
}
]
}
}
}
}
}
汇总模式
使用 collapsePattern
简化报告显示:
{
"options": {
"reporterOptions": {
"dot": {
"collapsePattern": "^node_modules/"
}
}
}
}
高级选项
preserveSymlinks
控制是否保留符号链接:
{
"options": {
"preserveSymlinks": true
}
}
combinedDependencies
处理 monorepo 项目中的依赖关系:
{
"options": {
"combinedDependencies": true
}
}
extraExtensionsToScan
扫描额外的文件扩展名:
{
"options": {
"extraExtensionsToScan": [".vue", ".svelte"]
}
}
最佳实践
-
渐进式分析:对于大型项目,建议先使用
includeOnly
和maxDepth
进行初步分析,再逐步深入。 -
可视化优化:合理使用
collapse
和focus
选项可以使可视化报告更加清晰易读。 -
性能考虑:在大型项目中,合理设置
doNotFollow
和exclude
可以显著提高分析速度。 -
持续集成:将 Dependency-Cruiser 集成到 CI/CD 流程中,使用验证规则确保依赖关系的健康状态。
通过合理配置这些选项,Dependency-Cruiser 可以成为你项目依赖管理的强大助手,帮助你发现潜在问题,优化项目结构。
创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考