使用ng serve允许同网设备访问时，Angular移动端测试加载中断

针对你遇到的Angular应用移动端加载到70%进度条卡住的问题，以下是几个可行的排查和解决办法：

• 禁用热重载
  ng serve默认的热重载依赖WebSocket连接，移动端长时间闲置或网络状态波动后，WebSocket可能中断导致资源加载异常。尝试启动时关闭热重载：

  ng serve --host=0.0.0.0 --port=4200 --disable-host-check --live-reload=false
  

  也可以修改angular.json中projects -> 你的项目名 -> architect -> serve -> options，添加"liveReload": false，永久禁用热重载。

• 重启服务并增加Node内存限制
  长时间运行ng serve会导致Node.js进程内存占用过高，引发编译或资源传输异常。先重启ng serve进程，若问题反复，启动时增加Node内存配额：

  NODE_OPTIONS="--max-old-space-size=4096" ng serve --host=0.0.0.0 --port=4200 --disable-host-check
  

  （4096代表4GB内存，可根据你的设备配置调整）

• 启用资源哈希避免缓存冲突
  移动端浏览器缓存的旧资源可能和新编译的资源冲突，导致加载卡住。启动时开启输出哈希：

  ng serve --host=0.0.0.0 --port=4200 --disable-host-check --output-hashing=all
  

  这样每次编译的资源文件名会带上唯一哈希值，强制浏览器加载最新资源。

• 指定WebSocket公开主机地址
  即使设置了--host=0.0.0.0，WebSocket的连接地址可能未正确指向你的桌面IP，导致移动端无法建立实时连接。启动时明确指定公开主机：

  ng serve --host=0.0.0.0 --port=4200 --disable-host-check --public-host=192.168.0.x:4200
  

  把192.168.0.x替换成你的桌面实际IP地址。

内容的提问来源于stack exchange，提问作者Diego Alves