React Native + Typescript 自定义库安装触发Duplicate identifier错误

问题背景 #

你创建了一个可跨项目复用的TS版API请求封装库，库的package.json依赖配置如下：

"dependencies": {
   "@types/node-fetch": "^2.5.10",
   "typescript": "^4.3.5"
}

你配置了postinstall脚本执行tsc命令构建库产物，从GitHub仓库安装到React Native项目时，抛出大量Duplicate identifier重复标识符类型错误。该库在Angular项目可正常运行，问题仅出现在RN环境。

根本原因 #

• 开发阶段所需的typescript、@types/node-fetch被错误放到了生产依赖中，安装到RN项目时会重复下载类型包
• React Native环境自定义了一套全局API（AbortController、FormData、WebSocket等）的类型定义，和Node类型、DOM类型的定义重复且不兼容
• postinstall执行tsc时默认会递归向上查找所有@types包，把RN项目里的类型也纳入了自定义库的编译范围，直接触发冲突

可行解决方案 #

1. 调整自定义库的依赖结构 #

将package.json中的typescript、@types/node-fetch全部从dependencies移动到devDependencies，这些依赖仅在库开发构建阶段需要，不需要被安装到业务项目中。

2. 替换postinstall构建逻辑 #

postinstall会在业务项目安装依赖时执行，必然继承RN项目的类型环境导致冲突，两种优化方案二选一：

• 本地提前执行tsc构建出产物，将构建后的dist目录推送到GitHub仓库，在package.json中配置main字段指向dist目录的入口文件，直接删除postinstall脚本
• 将构建脚本改为prepare，npm会自动在库打包/publish时执行构建，不会在业务项目安装时触发

3. 优化自定义库的tsconfig配置 #

在自定义库的tsconfig.json中添加如下配置，从根源避免外部类型干扰：

{
  "compilerOptions": {
    "typeRoots": ["./node_modules/@types"],
    "skipLibCheck": true,
    "lib": ["ESNext"]
  },
  "exclude": ["node_modules"]
}

配置说明：

• typeRoots指定只加载当前库自身node_modules内的类型包，不会读取上层RN项目的类型定义
• skipLibCheck跳过所有第三方.d.ts文件的类型检查，直接规避不同类型包之间的冲突
• lib移除dom配置，RN环境不存在DOM接口，不需要加载DOM类型定义，避免和RN自带全局类型冲突

4. 修复自定义库本身的类型错误 #

报错中包含你的业务代码错误：src/services/HttpService.ts中两个参数隐式any，给对应参数添加明确的类型定义即可。

5. RN项目侧兜底处理 #

如果调整后RN项目仍报类型冲突，在RN项目的tsconfig.json中添加"skipLibCheck": true配置，可直接解决绝大多数第三方类型包冲突问题。

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