使用Webpack构建的Heroku上的Angular应用程序 - 环境变量？

Question

我试图找出将环境变量加载到我的AngularJS应用程序的最佳方法.我目前正在使用常量,它们从Webpack中定义的值中获取它们的值definePlugin.但是,这会导致Heroku出现问题,因为代码是在推送到分段时构建的,当它被提升为生产时,它不会重建,因此webpack definePlugin常量是暂存环境变量.

我已经看过在运行时从我的API请求环境变量,然后将它们设置为在我的前端使用的常量,但我无法弄清楚如何在初始.constant(..)机会之外以编程方式设置常量.

如果有人知道在使用Webpack(而不是Grunt)时将环境变量加载到前端的任何其他更好的做法,请告诉我.

Answer 1

如果您在服务器中使用node.js（和npm），您可以考虑在“npm prestart”脚本中运行webpack，而不是在“npm postinstall”中运行。

这样，每次 Heroku dynos 启动或回收时，webpack 都会运行，因此会从适当的 Heroku 管道阶段获取您的环境变量定义。因此，当您的登台测功机启动时，webpack 将获取您的登台环境变量定义，而当您的生产测功机启动时，webpack 将获取您的生产环境变量定义。

然而，这种方法的缺点是，增加了测功机在回收时停止服务的时间，因为它们现在需要在启动之前运行 webpack。