npm install and build forked github repo

Posted 2023-02-16

【中文标题】npm install and build forked github repo

【英文标题】：npm install and build of forked github repo

【发布时间】：2017-03-24 12:11:18

【问题描述】：

我正在为我的 Angular 应用程序使用一个名为 angular-translate 的模块。但是，我不得不对源代码进行一些小的修改，以使一切按我想要的方式运行，现在我想在npm install 上保留这些更改。一位同事建议我 fork 源代码的 repo，并将我的 fork repo 作为依赖项，我已经尝试过这些方式，例如

npm install https://github.com/myRepo/angular-translate
npm install https://github.com/myRepo/angular-translate/archive/master.tar.gz

第一个给了我一个这样的目录，没有构建。只是一个 package.json、.npmignore 和一些 markdown 文件

-angular-translate
   .npmignore 
   .nvmrc
    CHANGELOG.md 
    package.json
    etc

第二个npm install 给了我完整的repo，但是当我使用命令npm install angular-translate 时，我又没有得到一个构建。我已经看到一些关于运行预发布脚本的讨论，但我不确定在安装所有模块时如何执行此操作。我也尝试将 fork 作为我自己的模块发布到 npm 注册表，但我再次没有构建，我不确定这是正确的做法......

对于我对这个话题的无知，我深表歉意。我没有大量使用 npm 的经验。希望得到关于这个问题的一些反馈。当需要对包的源代码进行修改时，这似乎是一个足够普遍的问题？也许有更好的解决方案？

【问题讨论】：

这是由于 Github 上的 repo 配置错误造成的。它缺少.npmignore 或package.json#files。有关详细信息，请参阅my answer。

【参考方案1】：

试试npm install <ghusername>/<repoName>，其中<ghUsername> 是您的GitHub 用户名（没有@），<repoName> 是存储库的名称。那应该正确安装它。您很可能希望将 --save 或 --save-dev 标志与 install 命令一起使用，以将依赖项保存在您的 package.json 中。

如果这不能正常工作，请检查您的 .npmignore 文件的内容。

如果安装命令需要很长时间，请不要惊慌；从 git 存储库安装比从 npm 注册表安装要慢。

---

编辑：

您的问题是，在您的情况下，dist/ 没有提交给 repo（因为它在.gitignore 中）。那是实际代码所在的地方。 dist/ 是在包发布到 npm 注册表之前从 src/ 中的文件构建的，但 dist/ 永远不会提交到 repo。

这很难看，但在这种情况下，您必须从 .gitignore 中删除 dist/，然后运行：

npm run build
git add .
git commit
git push

（确保您已先运行npm install）

然后你应该可以从 github 安装。

使用prepare 脚本可能还有另一种方法，但我不确定这是否可能；我从来没有尝试过。 编辑： Cameron Tacklind 写了一个很好的答案，详细说明了如何做到这一点：https://***.com/a/57829251/7127751

【讨论】：

感谢瑞恩的回复。试一试，但我得到了与第一次 npm 安装相同的结果。然后我尝试删除 .npmignore 文件，我得到了整个 repo，与第二个结果相同。问题仍然是构建没有发生。

除了 unignore dist 真的没有别的办法了吗？我想对原始 repo 做 PR，但是有了 dist，他不会喜欢吗？

@KaMok 我认为另一种选择是在你的 fork 的package.json 文件中，在scripts 下，将prepublish 重命名为prepare。似乎在执行 npm install 或 npm install github:user_name/fork_name --save （对于纱线也是如此）时，它也会运行 prepare 脚本中的内容。这是假设这个包的prepublish 脚本创建了构建文件，通常是这种情况。

如果你需要一个特定的分支，npm install <ghusername>/<repoName>#branchName

@RyanZim 你不正确。只要设置正确，从 git 安装就可以很好地工作。 docs.npmjs.com/cli/install "如果正在安装的包包含prepare 脚本，将安装它的dependencies 和devDependencies，并在打包和安装包之前运行准备脚本。"

【参考方案2】：

TL;DR 使用 prepare 脚本

别忘了 package.json#files 或 .npmignore

发布到 npmjs.com 的代码通常不是软件包存储库中的代码。将 javascript 源文件“编译”成用于库中一般使用的版本是很常见的。这就是通常发布到 npmjs.com 的内容。

npm 的一个特性是在发布之前自动运行“构建”步骤，这是很常见的 (npm publish)。这最初称为prepublish。似乎 Npm 认为在 npm install 上运行 prepublish 脚本会很方便，因为这是初始化开发环境的标准方法。

这最终导致了社区中的一些重大混乱。 Github 上有很长的问题。

最后，为了不改变旧的行为，他们决定再添加两个自动脚本：prepublishOnly 和 prepare。

prepublishOnly 符合您的预期。它不在npm install 上运行。许多包维护者只是盲目地切换到这个。

但也存在人们不想依赖 npmjs.com 分发包版本的问题。 Git 存储库是自然的选择。但是，通常的做法是不将“编译”文件提交到 git。这就是添加 prepare 来处理的内容...

---

prepare是正确的方式

如果您有一个包含源文件的存储库，但需要“构建”步骤才能使用它，prepare 在所有情况下都能满足您的需求（截至 npm 4） .

prepare：在打包和发布包之前，在本地 npm install 上运行，不带任何参数，在安装 git 依赖项时运行。

您甚至可以将构建依赖项放入devDependencies，它们将在prepare 执行之前安装。

这是我的一个包的an example，它使用了这种方法。

---

.gitignore 的问题

这个选项有一个问题会吸引很多人。 在准备依赖项时，Npm 和 Yarn 将仅保留package.json 的files 部分中列出的文件。

人们可能会看到files defaults to all files being included 并认为他们已经完成了。 容易忽略的是.npmignore大部分会覆盖files指令并且，如果.npmignore不存在，则使用.gitignore代替。

因此，如果您的构建文件列在 .gitignore 中，就像一个理智的人，并且不做任何其他事情，prepare 将似乎损坏 .

如果您将files 修复为仅包含已构建的文件或添加一个空的.npmignore，则一切就绪。

我的建议

设置files（或者，通过反转，.npmignore）使得实际发布的文件只有已发布包的用户需要的文件。 恕我直言，没有必要在已发布的包中包含未编译的源代码。

---

原答案：https://***.com/a/57503862/4612476

【讨论】：

PREPARE 为我工作而不是 POSTINSTALL。我只是在 prepare 中运行 npm run build。

【参考方案3】：

使用 npm 5 的更新：

从 npm@5 开始，prepublish 脚本已被弃用。

将prepare 用于构建步骤，prepublishOnly 用于仅上传。

我发现在脚本中添加 "prepare": "npm run build" 可以解决我的所有问题。

【讨论】：

这对我也有用（在我刚刚制作的叉子中）-谢谢！我想知道......为什么不是所有的包都默认包含这个脚本配置？是不是因为包作者只考虑从 npm 安装包的用例，而不是从 git repo 安装包的情况？所以他们只是习惯于手动运行 npm run build 和 npm run publish 并且不会遇到任何问题或痛苦，除非他们有一天尝试通过 git 安装 repo？

在使用prepare 时，有一个问题会引起很多人的注意。更多详情见我的回答

【参考方案4】：

为了借鉴@RyanZim 的出色回答，postinstall 绝对是一个有效的选择。

执行以下任一操作：

更新分叉存储库中的 package.json 以将 postinstall 元素添加到脚本中。在这里，运行任何你需要的东西来获得编译输出（首选）。 更新您的 package.json，并添加一个 postinstall 以更新 node_modules 中的必要目录。

如果您已经分叉了另一个人的存储库，那么可能值得提出一个问题来说明通过 GitHub 安装他们的包不起作用的问题，因为它没有提供构建脚本的必要方法。从那里，他们可以接受 PR 以通过 postinstall 解决此问题，或者他们可以拒绝它，您可以执行 #2。

【讨论】：

你能解释一下或有任何关于如何做#2的资源吗？当 gitrepo 只包含 src 而不是 dist 时，我需要在 npm install 之后运行哪些命令

@Daniel 道歉，我试图记住我过去这样做的背景。我认为通过＃2，我的意思是在您的主 packages.json 中添加一个安装后步骤，该步骤将运行最佳答案的步骤，因此遵循"postinstall": "cd node_modules/scrape-twitter/ && npm install && npm run build" 的内容，以确保在您之前构建引起您麻烦的包应用程序运行。不过，如上所述，我更喜欢将 repo 分叉给我自己的用户，将 postinstall 添加到包本身，然后在我的应用程序中使用它的方法。

我认为添加到 prepare 应该是首选（@Simon 的回答），因为如果从 npm 安装，你不需要做任何额外的构建，因为它应该已经包含一个 dist/ 目录。见docs.npmjs.com/misc/scripts：“准备：在打包和发布包之前运行...以及安装git依赖项时”

postinstall 距离正确的解决方案仅一步之遥。只需使用prepare。现在是 2020 年。

【参考方案5】：

只需使用命令npm install git+https://[e-mail]/myRepo/angular-translate.git。谢谢。

【参考方案6】：

如果您像我一样使用yarn。想象一下，你想使用像 this 这样的包： yarn add ghasemikasra39/gridfs-easy --save 其中ghasemikasra39 是用户名，gridfs-easy 是 repo 的名称