在 Linode 上部署 Angular

Question

我在 Linode 上部署 Angular 4 时遇到问题。

使用 Angular-cli，我有一个小型 Angular 4 应用程序，它只呈现基本的 google 地图。它可以在 here 上找到，并且运行在本地 mac 上没问题。

Linode 已经设置好运行ning Fedora 25，我可以通过 ssh 进入它。

我已经设置了主机名 'ofeyspi' 并将存储库克隆到我的 linode。

$ hostname
ofeyspi

检查主机名是否已经连接到url,

$ cat /etc/hosts
127.0.0.1   localhost localhost.localdomain localhost4 localhost4.localdomain4
::1         localhost localhost.localdomain localhost6 localhost6.localdomain6
139.162.199.9 ofeyspi.qqiresources.com ofeyspi

那我运行:

$ ng build --prod --bh /root/beans3/dist/
 11% building modules 9/9 modules 0 activeTemplate parse warnings:                 
The <template> element is deprecated. Use <ng-template> instead ("
  <div class="card">
    [WARNING ->]<template ngFor let-panel [ngForOf]="panels">
      <div role="tab" id="{{panel.id}}-header" [attr.ar"): ng:///root/beans3/node_modules/@ng-bootstrap/ng-bootstrap/accordion/accordion.d.ts.NgbAccordion.html@2:4
Hash: 079970cfbabe6b2f710a                                                              
Time: 34065ms
chunk    {0} polyfills.a3e056f914d9748ff431.bundle.js (polyfills) 158 kB {4} [initial] [rendered]
chunk    {1} main.47083d1d3073f3856af7.bundle.js (main) 142 kB {3} [initial] [rendered]
chunk    {2} styles.604a57bc7d4c0f84e447.bundle.css (styles) 122 bytes {4} [initial] [rendered]
chunk    {3} vendor.244ceb2ee1e4bb317079.bundle.js (vendor) 1.39 MB [initial] [rendered]
chunk    {4} inline.df954263324e7c133385.bundle.js (inline) 0 bytes [entry] [rendered]

如你所见，这给出了一个错误，模板元素有问题，在开发中可以忽略，但我想知道在生产中是否也一样。

这会创建一个新的 dist 目录，然后我运行,

$ ng server --host qqiresources.com

我也试过了，

$ ng server --host 139.162.199.9
** NG Live Development Server is running on http://139.162.199.9:4200 **
Hash: 2391cafc7c903540029f                                                              
Time: 17824ms
chunk    {0} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 158 kB {4} [initial] [rendered]
chunk    {1} main.bundle.js, main.bundle.js.map (main) 10.5 kB {3} [initial] [rendered]
chunk    {2} styles.bundle.js, styles.bundle.js.map (styles) 150 kB {4} [initial] [rendered]
chunk    {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 2.67 MB [initial] [rendered]
chunk    {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes [entry] [rendered]
webpack: Compiled successfully.

当我导航到 http://qqiresources.com:4200 or http://139.162.199.9:4200 时出现连接错误。

"This site can't be reached"

控制台显示，

Failed to load resource: net::ERR_CONNECTION_REFUSED

我已经尝试运行在 dist 目录和项目根目录中执行第二个命令。

还有什么我想念的吗？

更新：我现在看到 ng server 不正确，所以我安装了 node 并移动到 dist 目录，在那里我运行 http-server,

$ http-server
Starting up http-server, serving ./
Available on:
  http://127.0.0.1:8080
  http://139.162.199.9:8080
Hit CTRL-C to stop the server

但仍然导航到 http://139.162.199.9:8080 会出现相同的“无法访问站点”消息。

谢谢

更新：我已经让 apache 2 工作并为 dist 目录中的 index.html 文件提供服务。但是，使用 dist 中的其他文件似乎有问题。我在上面发布了一个问题

Answer 1

我对linode了解不多。但是你永远不应该运行 'ng serve' 在生产中。为什么不通过 apache、nginx 或生产节点服务器静态地提供 'dist' 文件夹。这就是大多数 angular 应用在生产环境中的服务方式。

在 Linode 上部署 Angular

Deploying Angular on Linode

linode

angular-cli

fedora-25