ng serve:如何更改检查器端口？

ng serve 是 Angular CLI 提供的一个命令，用于启动开发服务器并自动重新加载应用程序。默认情况下，Angular 开发服务器使用端口 4200。如果你想更改检查器（Inspector）端口，可以通过以下几种方式实现：

方法一：使用 --inspect 标志

Angular CLI 提供了 --inspect 标志来启用 Node.js 的调试功能，并允许你指定调试端口。你可以通过以下命令来更改检查器端口：

ng serve --inspect=9229

这里的 9229 是你想要使用的调试端口。

方法二：修改 angular.json 文件

你也可以通过修改项目的 angular.json 文件来更改检查器端口。找到 projects -> [your-project-name] -> architect -> serve -> options，然后添加或修改 inspectPort 属性：

{
  "projects": {
    "[your-project-name]": {
      "architect": {
        "serve": {
          "options": {
            "inspectPort": 9229
          }
        }
      }
    }
  }
}

保存文件后，再次运行 ng serve 命令，Angular CLI 将使用指定的端口启动开发服务器。

方法三：使用环境变量

你还可以通过设置环境变量来更改检查器端口。在 Unix/Linux 系统中，可以在终端中使用以下命令：

export NODE_OPTIONS="--inspect=9229"
ng serve

在 Windows 系统中，可以使用以下命令：

set NODE_OPTIONS=--inspect=9229
ng serve

应用场景

更改检查器端口通常在以下场景中非常有用：

1. 端口冲突：当默认端口 4200 被其他应用程序占用时，你可以通过更改端口来避免冲突。
2. 调试需求：如果你需要使用特定的调试工具或配置，更改端口可以让你更好地控制调试过程。

可能遇到的问题及解决方法

1. 端口已被占用：如果指定的端口已经被其他应用程序占用，Angular CLI 会报错并提示端口不可用。你可以尝试使用其他未被占用的端口。
2. 配置错误：如果在 angular.json 文件中配置错误，可能会导致 Angular CLI 无法正确启动开发服务器。确保配置文件的格式正确，并且 inspectPort 属性的值是一个有效的端口号。

参考链接

• Angular CLI 官方文档
• Node.js 调试指南

通过以上方法，你可以轻松地更改 Angular 开发服务器的检查器端口，以满足不同的开发和调试需求。