tsc编译依赖LibraryA时找不到js-yaml声明文件问题排查

问题场景 #

现有LibraryA依赖js-yaml库，将@types/js-yaml设为自身的devDependency，LibraryA自身编译正常。但在项目中把LibraryA作为devDependency安装后，引入其类型并编译项目时，tsc报错：

error TS7016: Could not find a declaration file for module 'js-yaml'

检查项目node_modules，发现确实没有@types/js-yaml，疑惑为何npm未自动安装该依赖。

依赖结构 #

project
└── package.json
    └── devDependencies
        └── LibraryA

LibraryA
└── package.json
    ├── dependencies
    │   └── "js-yaml": "^4.1.0"
    └── devDependencies
        └── "@types/js-yaml": "^4.0.5"

问题原因 #

• devDependency的传递规则限制：npm仅会传递依赖库dependencies中的包，devDependencies内的包不会被自动安装到上级项目。LibraryA将@types/js-yaml放在devDependencies中，因此项目安装LibraryA时，该类型包不会被自动拉取。
• TypeScript类型解析需求：当项目引入LibraryA的类型时，TypeScript需要解析LibraryA代码中用到的js-yaml类型声明，但项目环境中无对应类型文件，因此触发TS7016错误。

解决方案 #

方案1：调整LibraryA的依赖配置 #

将@types/js-yaml从LibraryA的devDependencies移至dependencies。这样项目安装LibraryA时，@types/js-yaml会作为依赖自动安装到项目的node_modules中。

修改后的LibraryA package.json示例：

{
  "dependencies": {
    "js-yaml": "^4.1.0",
    "@types/js-yaml": "^4.0.5"
  }
}

若LibraryA是对外发布的公共库，此方式可让所有使用者自动获取类型依赖，无需手动补充。

方案2：项目端手动补充依赖 #

在项目的package.json中手动添加@types/js-yaml到devDependencies，执行安装命令：

npm install --save-dev @types/js-yaml@^4.0.5

此方式适用于无法修改LibraryA源码的场景，直接在项目层面补全缺失的类型依赖。

内容的提问来源于stack exchange，提问作者Shrike