如何不使用Webpack/Rollup编译带依赖的TypeScript库？

核心原因 #

@my-lib/my-second-lib的package.json未将@my-lib/my-first-lib声明为自身依赖，导致npm/yarn安装@my-lib/my-second-lib时不会自动拉取其依赖的@my-lib/my-first-lib，最终在my-project中出现模块找不到的错误。

具体解决步骤 #

1. 给@my-lib/my-second-lib添加依赖声明 #

打开@my-lib/my-second-lib的package.json，在dependencies字段中添加@my-lib/my-first-lib的依赖（版本号与你实际使用的保持一致）：

{
  "dependencies": {
    "@my-lib/my-first-lib": "^1.0.0" // 替换为你的实际版本
  }
}

执行npm install或yarn install更新依赖，之后当my-project安装@my-lib/my-second-lib时，npm会自动将@my-lib/my-first-lib安装到项目的node_modules中，无需手动添加。

2. 检查库的package.json入口配置 #

确保每个库的package.json正确配置了编译产物的入口，让依赖库能正确解析路径：
以@my-lib/my-first-lib为例，在其package.json中添加以下字段：

{
  "main": "lib-es2015/index.js",
  "module": "lib-es2015/index.js",
  "types": "lib-es2015/index.d.ts"
}

这样@my-lib/my-second-lib在导入@my-lib/my-first-lib时，会直接使用package.json中定义的入口，而非硬编码编译后的目录路径，避免路径解析错误。

3. 修正源码中的导入路径 #

检查@my-lib/my-second-lib的源码，确保导入@my-lib/my-first-lib时使用的是包名而非编译后的目录路径：

• 错误写法：

  import { xxx } from '@my-lib/my-first-lib/lib-es2015/file-name'
  

• 正确写法：

  import { xxx } from '@my-lib/my-first-lib'
  

  让TypeScript通过模块解析机制自动找到正确的编译产物路径。

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