在 Cloud Foundry 中部署 Angular 应用程序答案

【问题标题】：Deploy Angular Application in Cloud Foundry在 Cloud Foundry 中部署 Angular 应用程序
【发布时间】：2018-05-02 07:00:47
【问题描述】：

我正在尝试在 Cloud Foundry 中部署我的 Angular 应用程序。

在使用 ng serve 进行本地测试后，我确认我的应用程序运行良好。

以下是我在 CF 中部署的步骤：

将dist文件夹复制到其他目录并创建manifest.yml文件，内容如下：（yml文件和dist文件夹在同一目录下）

applications:

name: deploy-ng4

memory: 128M

  buildpack: https://github.com/cloudfoundry/staticfile-buildpack.git

  path: dist

执行

cf push deploy-ng4 -m 128M -b https://github.com/cloudfoundry/staticfile-buildpack.git

【问题讨论】：

我已经成功部署了ng build --prod 的结果，因此您必须提供更多信息才能复制。你能得到一个正确的index.html 服务吗？另请注意，如果您要再次将内容作为标志传递给cf push，则没有任何意义，反之亦然。
请仔细检查清单文件的内容 - 对于应用程序配置，这看起来不像正确的 YAML，这可能是您需要推送标志的原因。另请注意，您将使用静态文件和 pushstate 路由，请参阅 docs.cloudfoundry.org/buildpacks/staticfile/index.html。
这可能无关紧要，但不要使用 buildpack 的 master 分支。你永远不知道你会得到什么。使用安装在您平台上的 buildpack（即cf buildpacks）或使用 buildpack 的发行版。使用 Github 撰写本文时最新版本的示例：-b https://github.com/cloudfoundry/staticfile-buildpack.git#v1.4.27。使用系统 buildpack 的示例：-b staticfile_buildpack.

【解决方案1】：

您使用了错误的 buildpack。 Cloud Foundry 内置了对 NodeJS 的支持，因此如果您的应用包含 package.json 文件，您可以发出以下命令：

cf push <APP> -m <Memory> .

NodeJS buildpack 是开源的，托管在：https://github.com/cloudfoundry/nodejs-buildpack，因此您可以自定义 buildpack 并像这样推送它：

cf push <APP> -m <Memory> -b 'https://github.com/cloudfoundry/nodejs-buildpack'

还要检查cf help push 以查看所有参数选项等。

顺便说一句，如果 NodeJS 的版本与 buildpack 中的默认版本不匹配，您必须在 package.json 中明确设置版本号。 See the document.

【讨论】：

【解决方案2】：

可能已经解决，但对于面临类似问题的人：检查angular.json 文件中的outputPath 属性。对于这种情况，它必须是：

"outputPath": "dist"

我在部署 PCF 时遇到了类似的问题。我使用 IntelliJ Idea 生成了我的 Angular 应用程序，并将项目名称附加到 outputPath。然后我得到了 403 - 禁止访问 PCF 为该服务提供的 URL，因为正确的 URL 带有 /projectname 附录。

【讨论】：