Angular CLI - ng serve 命令

本章通过示例解释了 ngserve 命令的语法、参数和选项。


语法

ng serve 命令的语法如下 −

ng serve <project> [options]
ng s <project> [options]

ng serve 命令构建并服务应用程序。 如果发生更改,它会重建应用程序。 这里的项目是 angular.json 中定义的应用程序的名称。


参数

ng serve 命令的参数如下 −

序号 参数 & 语法 说明
1 <project> 要构建的项目的名称。 可以是应用程序或库。

选项

Options 是可选参数。

序号 选项 & 语法 说明
1 --allowedHosts 允许访问开发服务器的主机白名单。
2 --aot=true|false 使用提前编译进行构建。
3 --baseHref=baseHref 正在构建的应用程序的基本 URL。
4 --buildEventLog=buildEventLog 构建事件协议事件的实验输出文件路径
5 --commonChunk=true|false 使用一个单独的包,其中包含跨多个包使用的代码。
6 --configuration=configuration

命名的构建目标,如 angular.json 的"configurations"部分中所指定。 每个命名目标都附有该目标的选项默认配置。 显式设置此选项会覆盖"--prod"标志。

别名: -c

7 --deployUrl=deployUrl 将部署文件的 URL。
8 --disableHostCheck=true|false

不验证连接的客户端是否属于允许的主机。

默认值: false

9 --help=true|false|json|JSON

在控制台中显示此命令的帮助消息。

默认值: false

10 --hmr=true|false

启用模块热替换。

默认值: false

11 --hmrWarning=true|false

启用 --hmr 选项时显示警告。

默认值: true

12 --host=host

要监听的主机。

默认值: localhost

13 --liveReload=true|false

是否在更改时重新加载页面,使用实时重新加载。

默认值: true

14 --open=true|false

在默认浏览器中打开 URL。

默认值: false

别名: -o

15 --optimization=true|false 启用构建输出的优化。
16 --poll 启用并定义文件监视轮询时间段(以毫秒为单位)。
17 --port

要监听的端口。

Default: 4200

18 --prod=true|false “--configuration=Production”的简写。 如果为 true,则将构建配置设置为生产目标。 默认情况下,生产目标是在工作区配置中设置的。
19 --progress=true|false 构建时将进度记录到控制台。
20 --proxyConfig=proxyConfig 代理配置文件。
21 --publicHost=publicHost 浏览器客户端(或实时重新加载客户端,如果启用)用于连接到开发服务器的 URL。 用于复杂的开发服务器设置,例如具有反向代理的服务器。
22 --servePath=servePath 提供应用程序的路径名。
23 --servePathDefaultWarning=true|false

当deploy-url/base-href使用不支持的服务路径值时显示警告。

默认值: true

24 --sourceMap=true|false 输出 sourcemaps
25 --ssl=true|false

使用 HTTPS 提供服务。

默认值: false

26 --sslCert=sslCert 用于服务 HTTPS 的 SSL 证书。
27 --sslKey=sslKey 用于服务 HTTPS 的 SSL 密钥。
28 --vendorChunk=true|false 使用仅包含供应商库的单独捆绑包。
29 --verbose=true|false 向输出日志记录添加更多详细信息。
30 --watch=true|false

根据变化进行重建。

默认值: true

首先移动到使用 ng build 命令更新的 Angular 项目,然后运行该命令。本章位于 https://www.w3ccoo.com/angular_cli/angular_cli_ng_build.htm


示例

下面给出了 ngserve 命令的示例 −

\>Node\>TutorialsPoint> ng serve
chunk {main} main.js, main.js.map (main) 14.3 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 141 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.15 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 12.4 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 3 MB [initial] [rendered]
Date: 2020-06-04T04:01:47.562Z - Hash: a90c5fc750c475cdc4d1 - Time: 10164ms
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
: Compiled successfully.

这里 ngserve 命令已成功构建并服务我们的项目 TutorialsPoint。现在在浏览器窗口中打开 http://localhost:4200 并验证输出。

输出