Angular 开发服务器
4200 是 Angular CLI 开发服务器（ng serve）的默认端口：执行 ng serve 后本地固定监听 4200，页面带热更新与源码映射，改代码即自动刷新。它与 3000、5173、8080 同属前端开发端口家族，只服务于开发与联调。生产环境应由构建产物加静态服务器或反向代理承载，直接暴露开发服务器既浪费资源，也会把源码映射一并送出去。
基本信息
| 服务 | Angular CLI dev server（ng serve） |
|---|---|
| 协议 | TCP/HTTP（默认 4200，可改） |
| 用途 | 前端开发、热更新、接口联调 |
| 同类端口 | 3000（React/Next）、5173（Vite）、8080 |
| 暴露要求 | 仅本机或开发内网 |
典型使用场景
- 本地开发：ng serve 启动后在浏览器验证页面与热更新
- 前后端联调：开发服务器指向后端接口地址调试跨域与鉴权
- 多实例并行：切换分支时用不同端口同时跑两套前端
- 演示：内网投屏给人看效果，需注意开发机是否在公共网络
- 排障：端口被占用时改用其他端口，或定位残留的 node 进程
常用命令
| 命令 | 作用 | 备注 |
|---|---|---|
| ng serve | 按默认端口启动 | 固定监听 4200 |
| ng serve --port 4300 | 改用其他端口 | 端口冲突时使用 |
| ng serve --host 0.0.0.0 | 允许同网段访问 | 仅限可信网段 |
| ng serve --open | 启动后自动打开浏览器 | 本地开发便利项 |
启动与排查
启动与排查
# 按默认端口启动开发服务器
ng serve
# 端口被占用时换端口
ng serve --port 4300
# 查看占用 4200 的进程
ss -lntp | grep 4200
# Windows 侧定位占用进程
netstat -ano | findstr :4200开发服务器默认不开启压缩与强缓存，也不做鉴权，它的定位就是本机调试。把联调地址写成局域网 IP 分享给同事时，请确认同网段可信，否则等于把项目源码与调试接口开放给整个网段。
热更新依赖本地文件事件：项目放在网络盘或容器共享目录上时事件可能丢失，表现为改了代码页面不刷新。遇到这种情况先确认目录类型与轮询配置，再去怀疑浏览器缓存。