yarn install 命令在 node_modules 中加载了错误的 git 分支

Wrong git branch loaded in node_modules by yarn install command

我有两个 Typescript 项目。

上下文: ProjectA依赖于某个ProjectB分支项目

项目 B git 分支机构:

  1. main
  2. new_branch

项目A package.json

"dependencies": {
    "@projectB": "git+https://github.com/projectB.git#new_branch",
}

我想达到什么目的? 当我执行 yarn install 以确保 new_branch 中的依赖项已加载到 projectAnode_modules 文件夹中时。

到底发生了什么? 当我执行 yarn install 时,来自 main 分支的依赖项被加载。

我尝试了什么?

  1. 我删除了 node_modulesbuild 文件夹并再次尝试 运行 yarn install 但没有成功。
  2. 我删除了 yarn.lock,但项目拆分了另一个与我对 new_branch 的更改完全无关的错误。
  3. 我从 package.json 文件中删除了 @projectB: git+https://github.com/projectB.git#new_branch 依赖项,然后通过 yarn add projectB@git+https://github.com/projectB.git#new_branch 添加了它,但是没有用。

我不确定 git 分支是否具有 npm 依赖性。也许有可能,但通常您会将该 git 存储库发布到 npm 存储库。或者您可以像这样引用 'main' 文件:

解决方案 1 - 从本地安装的 npm 项目导入

repo1/package.json

  "files": [
    "dist" // the generated production output from this repo
  ],
  "main": "dist/index.umd.js",

您还必须在两个存储库中安装 npm 包才能工作。

repo2/package.json

  "dependencies": {
    "@otherrepo": "file:../repo1"
   }

repo2/index.js

import otherrepo from '@otherrepo'

// do stuff with other repo

请注意,对于此解决方案,您需要在 webpack 或等效项中配置别名 @otherrepo。

不确定这是否是您想要的,但这是我使用 2 个存储库(webpack 和 microbundle)创建的示例 webpack 示例将 microbundle 的输出作为依赖项加载

https://github.com/inspiraller/webpack-and-microbundle

解决方案 2 - 将您的 git 存储库发布到 npm

一旦你对你的开发周期感到满意,你就可以将 repo 1 发布到 npm 存储库,然后你可以像安装任何其他 npm 包一样安装它。

解决方案 3 - 使用 git 子模块:

在这里回答: How can I have linked dependencies in a git repo?

我敢肯定这里的技术很先进,但是当我玩它的时候我发现缓存和重新安装的陷阱太多了。

解决方案 4 - 通过外部托管 cdn 加载共享组件

这是针对 React 的,但可能还有其他框架的替代方案

原因是您应该在分支名称前加上 #branch=new_branch#head=new_branch 前缀。此外,如果您想使用特定的工作空间,您也可以将其附加到 URL:

https://github.com/projectB#branch=new_branch&workspace=@projectB/workspace-you-want-to-install-from-new_branch

另一种 link 更具体的方法是提交 SHA:

https://github.com/projectB#commit=f4f78b319c308600eab015a5d6529add21660dc1&workspace=@projectB/workspace-you-want-to-install-from-that-commit-sha

如果您在任何时候需要进行故障排除,您应该搜索您的 yarn.lock 以了解 package.jsonresolution 下的解析结果。