Angular 通用生产构建流程

Question

我正在使用 Angular Universal 10，我想预渲染我的网站。

我对生产环境的正确构建过程感到困惑。

Angular 给出了这两个命令：

"build:ssr": "ng build --prod && ng run my-app.spa:server:production",
"prerender": "ng run my-app.spa:prerender"

仅仅这样做就足以获得生产就绪的输出吗？

npm run prerender

或者我需要同时运行这两个？

npm run build:ssr
npm run prerender

有什么不同？

Answer 1

要了解这两个命令之间的区别，请运行一个命令并查看编译的输出。

第一个命令npm run build:ssr会将您的站点编译成一个可以使用 NodeJS Express 应用程序提供服务的文件，如您在server.ts. 这样，您仍然只有一个 index.html 文件，但根据您的路线，universal 会将该路线的渲染 html 文件传送到浏览器。所以，你是在服务器上渲染，服务器端渲染。

第二个命令npm run prerender将使用server.ts每个路由及其自己的单独的 index.html 文件“预渲染”，所有路由都根据您的路由放置在目录结构中。编译后的代码看起来就像一个传统的静态网站。因此，您在部署之前进行渲染，即预渲染。

那么哪个最适合您？

build:ssr

• 优点：如果内容是动态创建的，则无需重新部署
• 缺点：服务器必须始终运行可靠且快速的 NodeJS 进程。好消息是有很多方法可以做到这一点，例如无服务器功能、应用程序引擎等。

prerender

• 优点：您的应用程序可以托管在常规 http 服务器上
• 缺点：添加新内容页面时您可能需要重新部署

Medium 上的这篇文章有很好的概述和更详细的信息。