如何托管angular 2网站?

时间:2017-03-03 08:29:20

标签: angular server hosting frontend

如何托管angular 2网站?

我是角色2的新手,我创建了一个没有后端的简单网站。

我想知道当我尝试直接打开index.html文件时,会打开并显示错误。

但是在命令"npm start"之后它运行正常,它在计算机上运行本地服务器。

那么,如何在简单的托管网站上托管这个网站(不是专用服务器..!)?

我认为托管网站会自动找到index.html文件,但问题是,如果没有"npm start"命令,index.html就无法启动。

我可以在服务器上启动该进程吗?

请指导我。

4 个答案:

答案 0 :(得分:26)

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

第1步:构建应用

运行以下cmd构建

ng build --prod

第2步:创建FireBase项目并安装Firebase CLI

https://console.firebase.google.com/打开Firebase控制台,然后创建一个新的Firebase项目。

要安装Firebase命令行工具,请执行以下命令:

npm install -g firebase-tools

第3步:部署到FireBase

运行以下firebase cmd登录:

firebase login

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

现在运行以下cmd:

firebase init

首先,您被问到要使用哪个Firebase客户端功能。您应该选择托管选项:配置和部署Firebase托管站点。接下来,Firebase客户端将询问用于部署的文件夹。输入 dist 。这很重要,因为这是我们的生产构建存储的位置。

接下来问题是询问此应用是否是单页应用,是否应重写所有URL到index.html。在我们的例子中,我们需要回答是。

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

现在,运行以下cmd进行部署:

firebase deploy

Firebase将提供网址,您可以使用该网址在线访问您的应用。

<强> [更新]

如果您想要进行一些更改并在同一URL上部署代码,那么在成功部署应用程序之后。按照相同的步骤。但请确保您指向您的项目。

要列出所有项目,请使用以下命令:

firebase list

要将项目作为当前项目使用:

firebase use <project_id>

答案 1 :(得分:3)

您可以使用 http-server

http-server 是一个简单的零配置命令行http服务器。它足够强大,适合生产使用,但它足够简单,可以用于测试,本地开发和学习。

npm install http-server -g

通过以下方式构建项目:

ng build -app

然后在项目目录中使用:

http-server dist/ -p 3000 // -p is port 
浏览器Expressions in the Debuggerhttp://localhost:3000

上的

答案 2 :(得分:2)

您可以使用heroku部署解决方案:

https://www.heroku.com

答案 3 :(得分:1)

如果你有一个简单的托管包,答案是你不能

普通主机提供商的托管包不提供此功能。

您需要像Google Firebase这样的“特殊服务提供商”,或者您需要拥有自己的(虚拟)计算机(在托管服务提供商处)。