Heroku 和 Angular 路由

Posted 2023-03-07

【中文标题】Heroku 和 Angular 路由

【英文标题】：Heroku and Angular routing

【发布时间】：2017-04-04 13:14:23

【问题描述】：

我正在开发一个使用 Yoeman Angular 包构建的 Angular 前端站点。该项目使用 Node.js 构建包托管在 Heroku 中。

Heroku 构建项目时没有错误，它运行 Gulp 和 Bower 来安装依赖项。启动脚本执行完毕并编译项目后，索引页面加载没有问题，但任何其他不是主页的页面（例如登录页面）都会陷入“无法获取/登录”消息。

这似乎是一个常见问题，因为我已经阅读了很多关于如何解决 Heroku 上的 Angular 路由的帖子。这些是我目前采取的所有行动都没有成功：

在 Express 中创建一个 Node.js 网络服务器（我已经尝试过这个脚本的多种风格）

var gzippo = 需要('gzippo'); var express = require('express'); var morgan = require('morgan'); var app = express();

app.use(morgan('dev')); app.use(gzippo.staticGzip("" + __dirname + "/dist")); app.use('/bower_components', express.static(__dirname + '/bower_components')); app.listen(process.env.PORT || 5000);

注释 .gitignore 中的 dist 文件夹，以便 Heroku 使用它。 dist 文件夹被推送到 Git 中。

创建环境变量 NODE_ENV: true, NODE_PATH: true, NPM_CONFIG_PRODUCTION: false

当 dist 文件在 Apache 服务器上独立运行或使用上面的 Node.js 脚本运行时，该站点在本地完美运行。

如果有任何 cmets 可以帮助我在 Heroku 和 Angular 上解决此问题，我将不胜感激。提前致谢。

【参考方案1】：

我猜在这么长时间之后你已经能够解决这个问题（或者你转向其他事情）。

无论如何，对于遇到类似问题的任何人，我都使用 Angular2 + Express 应用程序创建了一个公共存储库，该应用程序已经配置为在 Heroku 上部署。

https://github.com/pabloruiz55/Angular-Express-Heroku

我无法完全回答这个问题，因为我缺少诸如您遇到的错误之类的信息，但希望看看我的入门项目，任何人都可以弄清楚。