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 服务器上
• 缺点：添加新内容页面时可能需要重新部署

This post on Medium 有一个很好的概述和更详细的信息。