如何在VSCode中配置Github实现Angular公共文件多仓库同步更新？

1. 提取公共代码为独立GitHub仓库 #

• 打开你的Angular项目，在根目录新建shared-admin-modules文件夹，将用户表单、UserRights、登录表单、个人资料、密码修改、设置模块等公共文件全部移入该文件夹
• 打开VSCode内置终端，进入shared-admin-modules目录，执行git init初始化本地Git仓库
• 登录GitHub新建对应仓库（可设为公开或私有），复制仓库的HTTPS/SSH地址
• 回到VSCode终端，在shared-admin-modules目录下依次执行命令：

  git add .
  git commit -m "init: 提交公共模块初始代码"
  git remote add origin 你复制的公共仓库地址
  git push -u origin main
  

• 回到项目根目录，删除原有散落的公共文件，将shared-admin-modules加入根目录的.gitignore文件，避免被业务仓库重复提交

2. 初始化业务项目独立GitHub仓库 #

• 在GitHub新建业务项目专属仓库，复制仓库地址
• 回到VSCode终端，在项目根目录依次执行命令：

  git init
  git add .
  git commit -m "init: 提交业务项目初始代码"
  git remote add origin 你复制的业务仓库地址
  git push -u origin main
  

3. 实现公共模块复用与改动同步 #

以下两种方案可按需选择：

方案A：Git子模块（适合公共模块改动频繁、需要实时同步的场景） #

• 在业务项目根目录执行命令，将公共仓库作为子模块挂载到项目中：
  git submodule add 公共仓库地址 shared-admin-modules
• 公共模块修改时，直接在VSCode的shared-admin-modules目录下修改，修改完成后在该目录下单独执行Git提交推送至公共仓库即可
• 其他使用该公共模块的项目，只需在根目录执行git submodule update --remote shared-admin-modules即可拉取最新的公共模块改动
• 新项目需要复用公共模块时，直接执行上述子模块添加命令即可快速引入

方案B：Angular私有库（适合公共模块稳定、复用项目多的场景） #

• 将shared-admin-modules按照Angular Library规范重构，执行ng generate library admin-common生成标准库结构，把公共代码移入对应目录
• 打包后可发布到GitHub Packages或者私有npm仓库，所有项目可直接通过npm install admin-common安装引入
• 公共模块改动后升级版本号重新发布，所有项目执行npm update admin-common即可同步最新改动

VSCode快捷操作提示 #

• 无需全程敲命令，VSCode左侧「源代码管理」面板会自动识别根目录业务仓库和子模块仓库的改动，可分别选中提交、推送、拉取，操作更直观
• 切换项目分支后如果子模块版本不匹配，直接在源代码管理面板选中公共模块仓库点击「拉取」即可同步到最新版本

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