如何在React与React Native项目间复用TypeScript类型及工具函数

1. 发布私有npm包 #

这是长期维护最靠谱的方案。把两个项目共用的TypeScript类型、工具函数抽离到独立的代码仓库，打包成私有npm包：

• 初始化一个新的npm项目，配置package.json：指定私有包名、版本号，设置main指向编译后的JS入口，types指向TS类型定义文件，通过files字段明确需要发布的源码或编译产物。
• 将共享代码移入该项目，按需用TypeScript编译。
• 发布到私有npm仓库（比如npm官方私有库、Verdaccio本地私有源）。
• 在React和React Native项目中通过npm install [私有包名]安装依赖，之后直接导入使用。
• 后续更新共享代码时，升级私有包版本，两个项目同步更新依赖即可。

优点：版本管理清晰，团队协作统一，维护成本低；缺点：需要搭建/使用私有npm源，每次更新需走发包流程。

2. 使用本地包链接（npm link / yarn link） #

适合本地开发阶段快速同步修改：

• 将共享代码放在独立文件夹，在该文件夹下执行npm link（或yarn link）。
• 在React和React Native项目中，分别执行npm link [共享包名]（或yarn link [共享包名]），把本地共享包链接到项目的node_modules中。
• 修改共享代码后，两个项目会实时同步更新，无需重新安装。

优点：开发阶段效率高，实时反馈修改；缺点：团队协作时需每个人手动配置链接，部署时需替换为正式包依赖，不适合长期生产环境。

3. Git子模块（Git Submodule） #

通过Git子模块将共享代码仓库嵌入到两个项目中：

• 在React或React Native项目根目录执行git submodule add [共享代码仓库的Git地址] ./src/shared（指定存放共享代码的路径）。
• 提交子模块配置到项目仓库，其他开发者拉取项目时需执行git submodule init和git submodule update来拉取共享代码。
• 两个项目直接从子模块目录导入类型和工具函数即可。
• 共享代码更新时，在子模块目录拉取最新代码，然后提交子模块的版本更新到主项目仓库。

优点：无需发包，可跟踪共享代码的版本；缺点：Git子模块操作有一定学习成本，更新、合并时容易出现问题，对新手不友好。

4. 脚本同步（临时过渡方案） #

如果上述方案都不想折腾，可写脚本实现文件同步：

• 编写Node.js或Shell脚本，指定需要同步的文件路径（比如React项目中所有.d.ts类型文件和工具函数文件），将这些文件复制到React Native项目的对应目录。
• 把脚本加到项目的package.json的scripts中，比如"sync-shared": "node ./scripts/sync-shared.js"，在需要同步时执行，或者在提交代码前自动运行。

优点：实现简单，无需额外工具；缺点：容易出现版本不一致，文件冲突难以处理，仅适合短期过渡，不推荐长期使用。

内容的提问来源于stack exchange，提问作者Nyi Nyi Hmue Aung