如何托管Angular 2网站？

Question

如何托管Angular 2网站？

我是Angular 2的新手，并制作了一个没有后端的简单网站。

我想知道当我试图直接打开index.html文件时，它会出现错误。

但是，在执行“npm start”命令后，它就可以正常工作，该命令在计算机上运行本地服务器。

那么，如何将此网站托管在简单的托管网站上（不是专用服务器...！）？

我认为托管网站会自动找到index.html文件，但这里有问题，没有“npm start”命令，index.html无法启动。

我需要在服务器上启动一个进程吗？

请指导我。

- Yash

---

每个HTTP服务器都可以提供Angular2应用程序服务。 - Günter Zöchbauer

Answer 1

使用以下简单步骤在 Firebase 上托管您的 Angular 2 应用程序： 首先使用 Angular CLI 创建项目。获取更多信息，请参阅https://cli.angular.io/

步骤1：构建您的应用程序

运行以下命令以构建应用程序。

ng build --prod

步骤2：创建Firebase项目并安装Firebase CLI

打开 https://console.firebase.google.com/，创建一个新的Firebase项目。

运行以下命令来安装Firebase命令行工具：

npm install -g firebase-tools

步骤 3：部署至 FireBase

运行以下 Firebase 命令进行登录：

firebase login

它将打开浏览器并要求您进行身份验证。使用您的 Firebase 帐户登录。之后，您可以关闭浏览器窗口。在命令行中，您将收到执行登录成功的消息。

现在运行以下命令：

firebase init

首先，您需要选择要使用的Firebase客户端功能。您应该选择选项Hosting: Configure and deploy Firebase Hosting site。接下来，Firebase客户端会询问要用于部署的文件夹。输入dist。这很重要，因为这是我们的生产构建存储的位置。

接下来的问题是是否是单页应用程序，并且是否应将所有URL重写为index.html。在我们的情况下，我们需要回答是。

最后一个问题是Firebase是否应覆盖文件index.html。那个问题的答案是不。

现在，运行以下命令以进行部署：

firebase deploy

Firebase将提供一个URL，您可以使用它在线访问您的应用程序。

[更新]

现在，在您成功部署应用程序后，如果您想进行一些更改并在相同的URL上部署代码，请遵循相同的过程。但请确保您指向您的项目。

要列出所有项目，请使用此命令：

firebase list

将一个项目设置为当前项目使用：

firebase use <project_id>

- AmanDeepSharma

---

你好，我按照这个指示上传了我的应用程序！但是现在我有一个问题，因为我已经做了一些更改，如何更新？ - Ixam Deirf

嗨 @IxamDeirf，这很简单，你只需要按照相同的步骤操作，但在此之前，请确保你正在指向你当前正在工作的项目。我已经更新了我的回答，请查看回答末尾。 - AmanDeepSharma

谢谢@amanDeepSharma，它像魔法一样运行！非常有趣和有价值的信息分享给Angular新手们。 - shaan gola

Answer 2

你可以使用 http-server： http-server 是一个简单的、零配置的命令行 http 服务器。它足够强大，可用于生产环境，但也足够简单和可定制，可用于测试、本地开发和学习。

npm install http-server -g

按以下步骤构建项目：

ng build -app

在项目目录中使用以下命令：

http-server dist/ -p 3000 // -p is port 

在浏览器中访问http://localhost:3000或http://your-ip:3000

。

- waris

Answer 3

你可以使用Heroku来部署你的解决方案：

https://www.heroku.com

- Ahmed

Answer 4

如果您使用的是简单的主机套餐，那么答案是无法实现。

普通主机提供商的主机套餐不提供此功能。

您需要使用像Google Firebase这样的“特殊提供商”，或者拥有自己的（虚拟）机器（在托管提供商处）。

- RWC