你如何部署 Angular 应用程序? [英] How do you deploy Angular apps?

问题描述

一旦 Angular 应用程序进入生产阶段，您如何部署它们?

How do you deploy Angular apps once they reach the production phase?

到目前为止我看到的所有指南(甚至在 angular.io 上)都依赖于精简版服务器用于服务和浏览器同步以反映更改 - 但是当您完成开发时，您如何发布应用程序?

All the guides I've seen so far (even on angular.io) are counting on a lite-server for serving and browserSync to reflect changes - but when you finish with development, how can you publish the app?

我是在 index.html 页面上导入所有已编译的 .js 文件还是使用 gulp 缩小它们?他们会工作吗?我在生产版本中完全需要 SystemJS 吗?

Do I import all the compiled .js files on the index.html page or do I minify them using gulp? Will they work? Do I need SystemJS at all in the production version?

推荐答案

您实际上在这里将两个问题合二为一.

You are actually here touching two questions in one.

第一个是如何托管您的应用程序?.
正如@toskv 提到的，它的问题实在是太宽泛了，无法回答，而且取决于许多不同的事情.

The first one is How to host your application?.
And as @toskv mentioned its really too broad question to be answered and depends on numerous different things.

第二个是您如何准备应用程序的部署版本?.
您有几个选择:

The second one is How do you prepare the deployment version of the application?.
You have several options here:

1. 按原样部署.就是这样 - 没有缩小、串联、名称修改等.转换所有 ts 项目，将所有生成的 js/css/... 源+ 依赖项复制到托管服务器，您就可以开始了.

2. 使用特殊的捆绑工具进行部署，例如 webpack 或 systemjs builder.
   它们具有 #1 所缺乏的所有可能性.
   您可以将所有应用程序代码打包到您在 HTML 中引用的几个 js/css/... 文件中.systemjs builder 甚至允许您摆脱将 systemjs 作为部署包的一部分的需要.

1. Deploy as it is. Just that - no minification, concatenation, name mangling, etc. Transpile all your ts project copy all your resulting js/css/... sources + dependencies to the hosting server and you are good to go.

2. Deploy using special bundling tools, like webpack or systemjs builder.
   They come with all the possibilities that are lacking in #1.
   You can pack all your app code into just a couple of js/css/... files that you reference in your HTML. systemjs builder even allows you to get rid of the need to include systemjs as part of your deployment package.

从 Angular 8 开始，您可以使用 ng deploy 从您的 CLI 部署您的应用程序.ng deploy 需要与您选择的平台(例如 @angular/fire)结合使用.您可以查看官方文档以了解什么最适合您此处

You can use ng deploy as of Angular 8 to deploy your app from your CLI. ng deploy will need to be used in conjunction with your platform of choice (such as @angular/fire). You can check the official docs to see what works best for you here

是的，您很可能需要将 systemjs 和一堆其他外部库部署为您的包的一部分.是的，您将能够将它们捆绑到您从 HTML 页面引用的几个 js 文件中.

Yes you will most likely need to deploy systemjs and bunch of other external libraries as part of your package. And yes you will be able to bundle them into just couple of js files you reference from your HTML page.

不过，您不必从页面中引用所有已编译的 js 文件 - systemjs 因为模块加载器会处理这些.

You do not have to reference all your compiled js files from the page though - systemjs as a module loader will take care of that.

我知道这听起来很混乱 - 为了帮助您开始使用 #2，这里有两个非常好的示例应用程序:

I know it sounds muddy - to help get you started with the #2 here are two really good sample applications:

SystemJS 构建器:angular2 种子

SystemJS builder: angular2 seed

WebPack:angular2 webpack starter

这篇关于你如何部署 Angular 应用程序?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！