Heroku部署问题：sh: 1: ng:未找到？

Question

我在Heroku上运行应用程序时遇到了一些问题。

日志:

 2017-10-22T20:41:16.421991+00:00 app[web.1]: npm ERR! errno ENOENT
 2017-10-22T20:41:16.411165+00:00 app[web.1]: > ng serve
 2017-10-22T20:41:16.411149+00:00 app[web.1]: 
 2017-10-22T20:41:16.421630+00:00 app[web.1]: npm ERR! file sh
 2017-10-22T20:41:16.411165+00:00 app[web.1]: 
 2017-10-22T20:41:16.416314+00:00 app[web.1]: sh: 1: ng: not found

package.json：

"scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
},

环境:

我使用的是 Angular 4，没有使用 NodeJS express。我的应用程序已经在 Heroku 上部署。

- Kanna

---

{btsdaf} - halfer

Answer 1

你可以通过设置环境变量 NPM_CONFIG_PRODUCTION 为 false，让 Heroku 构建你的开发依赖。 (如何设置?)

---

或者你可以将以下内容（适用于 Angular 9）从 devDependencies 移动到 dependencies:

@angular/cli,
@angular/compiler-cli
@angular-devkit/build-angular
typescript

这样做之后，请运行：

 npm i @angular/cli @angular-devkit/build-angular @angular/compiler-cli typescript --save-prod

或者与您指定的版本一起使用，例如：

 npm i @angular/cli@9.1.x @angular-devkit/build-angular@0.901.x @angular/compiler-cli@9.1.x typescript@3.8.x --save-prod

Github的问题

- ya_dimon

---

不要在生产环境中使用 ng serve。相反，部署生产构建。 - Chris

@Chris 啊，你可能误解了答案，没有人建议在生产中使用 ng serve。大多数情况下，是使用 ng build，以便不将编译后的代码提交到 git，并使用服务器的环境变量进行构建。 - ya_dimon

也许你误解了。Heroku会在构建阶段自动运行您的“build”脚本。在此阶段，“devDependencies”可用。无需将它们移动到“dependencies”。构建阶段完成后，将修剪“devDependencies”。正确的解决方案是确保您的“build”脚本进行生产构建，并将构建文件作为静态资源托管。如果出现关于“ng”的运行时错误，则未正确执行此操作。 - Chris

@Chris 看起来不错，我认为在问题/答案的时候 heroku 在构建 ng build 时没有使用 devDeps（请看 gh issue）。现在可能已经像 heroku 文档中所述那样工作了。但是，在回答中仍然没有建议在生产环境中使用 ng serve，这就是我的评论重点。 - ya_dimon

Heroku的Node.js构建包在2020年肯定安装了开发依赖项，并在构建阶段中使它们可用，我相信2017年也是如此。这一直是我记忆中的情况。将某些内容从开发依赖项移动到依赖项的唯一原因是在运行时使其可用。告诉别人这样做就像告诉他们使用ng来提供他们的应用程序一样。 - Chris

Answer 2

在生产环境中，Angular 代码被部署为静态代码。

只需运行：

ng build --prod --aot

将生成的dist文件夹部署为静态网站。

参考：https://www.youtube.com/watch?v=jw1RtGJKIbw

- nilansh bansal