NG Live Development Server与传统Web服务器

时间:2017-10-10 13:36:28

标签: node.js angular typescript command-line-interface

我是Angular2的新手。我已经说过通过互联网上的资源进行学习。

我正在使用Angular-Cli工具来构建我的测试应用程序。

当我发出命令ng serve --open时,我的示例项目在默认端口4200和控制台显示上运行,

** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200 **

现在我对 NG Live Development Server 感到困惑。

我有以下疑虑,

  • 作为客户端框架,为什么angular需要开发服务器。

  • Live Server实际位于正在运行的计算机中

  • Live Server 只能提供Javascript或任何其他语言。
  • 是什么? 将Angular2应用程序与服务器端集成的复杂性 像Spring-MVC这样的框架。

有谁可以请您提出这方面的想法?如果我错误地理解了这些概念,请纠正我。

2 个答案:

答案 0 :(得分:4)

Tl; cli live服务器博士仅用于本地开发。不适用于生产或本地开发以外的任何环境。

回答您的具体问题:

  

作为客户端框架,为什么angular需要开发服务器。

Angular是一个SPA框架。编译的应用程序代码需要从Web服务器加载到浏览器中。

  

Live Server实际位于正在运行的计算机中

服务器是Webpack的一部分,Webpack是Angular-CLI的依赖项。所以它在你的node_modules文件夹中。

  

Live Server只能使用Javascript或任何其他语言。

开发服务器仅用于在本地开发计算机上运行Angular代码。如果您有API后端,则应该通过开发服务器查看proxying请求到您的dev API。

  

将Angular2应用程序与Spring-MVC等服务器端框架集成的复杂性是什么。

这是微不足道的。您不会在live dev服务器上托管您的Angular应用程序。相反,您将运行ng build --prod --aot将生产包构建到项目dist文件夹中。这些是将部署到您的前端Web服务器的构建工件。将前端配置为在根竞赛中运行,即www.foo.com/,并将Spring API运行在/ api上下文www.foo.com/api/

答案 1 :(得分:3)

您可能想看看这个:

Node live server

这清楚地解释了什么是实时服务器以及它是如何工作的: 引自链接:

  

服务器是一个简单的节点应用程序,为工作目录提供服务   它的子目录。它还会监视文件的变化和时间   发生这种情况时,它会通过Web套接字连接发送消息   浏览器指示它重新加载。为了客户端   支持这一点,服务器注入一小段JavaScript代码   每个请求的html文件。此脚本建立Web套接字   连接并侦听重新加载请求。 CSS文件可以   通过查找引用来刷新没有完整页面重新加载   来自DOM的样式表和欺骗浏览器来获取和解析   他们又来了。

如果您浏览完整篇文章,几乎可以得到所有问题的答案。