时间戳

首页 > 解决方案 > Angular Universal，在 Firebase 上用于静态页面的应用程序？

angular - Angular Universal，在 Firebase 上用于静态页面的应用程序？

问题描述

相关背景：我是初学者。

我目前的申请：

  1. 是 Angular 7，
  2. 托管在 GitHub Pages 上，
  3. 由一个实际上需要 Angular 功能的页面（主页——一个计算器）和几个基本上只是静态 HTML 的页面组成。（每个这样的页面当前都是一个 Angular 组件。）

我最近才意识到 Google 无法“看到”其他页面上的任何内容。我认为这是因为 GitHub Pages 基本上会接受每个请求并重定向到主页，但我这里的理解可能存在缺陷。

我在最后一天左右一直在阅读这个，我想我已经了解到：

  1. Angular Universal 可用于将静态页面呈现为常规 HTML，以便 Googlebot 可以看到它们，并且
  2. Angular Universal 不能与 GitHub Pages 一起使用。

我的问题：

1) Angular Universal 是这里最好的解决方案吗？我一直在读到 Angular Universal 很难实现，并且不能很好地处理各种事情。还有什么我应该研究的吗？（优先事项是易于实施。）

2) 如果我实现 Angular Universal，Firebase 是否适合托管应用程序？

感谢您的任何输入/反馈。

标签： angularangular-universal

解决方案

经过几天的反复试验和谷歌搜索，我偶然发现了这个过程。所以我只是想我会分享我遵循的步骤，以防其他人将来遇到这个线程。

首先，我按照@AlexanderStaroselsky 的建议与另一家公司建立了托管关系。（我选择了 a2hosting，尽管我没有理由认为它们比其他提供商更好。）

我首先按照本教程中的步骤操作：
https ://medium.com/@MarkPieszak/angular-universal-server-side-rendering-deep-dive-dc442a6be7b7

然后我按照这里的步骤，创建 prerender.ts 文件等等：
https ://github.com/angular/angular/issues/23024#issuecomment-446205508

然后我得到一个错误：“找不到模块...... ngfactory。” 因此，经过一番搜索，我对此处所示的 app.server.module 进行了更改：
https ://medium.com/@suman.g/great-article-worked-like-charm-21673f8b6f80

然后我编辑了 tsconfig.server.json 以包含有关“commonjs”的行，如下所示：
https ://github.com/angular/universal-starter/blob/master/src/tsconfig.server.json

最后，我将 dist/browser 目录中的所有内容（仅此而已）上传到我的主机。（对于a2托管，我把它放在public_html目录中。）

推荐阅读