vue(webpack)项目在使用nginx 代理后，热更新失效问题

问题描述

本地开发vue项目，使用localhost访问没得问题，可以热更。但是一旦使用nginx 代理。访问 http://XXXX.com 就热更失效。

并且会看到控制台报错

/sockjs-node/info?t=1462183700002 net::ERR_CONNECTION_REFUSED 

问题原因

导致这个问题的原因是: nginx没有代理热更模块，直接访问了XXXX.com。所有热更失效了。

解决方案

解决方案也很简单就是我们手动在ngixn里面添加一个sockjs-node的代理如下：

location /sockjs-node { # 配置sockjs-node
	  proxy_set_header X-Real-IP  $remote_addr;
	  proxy_set_header X-Forwarded-For $remote_addr;
	  proxy_set_header Host $host;
	  proxy_pass http://127.0.0.1:7012;
	  proxy_redirect off;
	  proxy_http_version 1.1;
	  proxy_set_header Upgrade $http_upgrade;
	  proxy_set_header Connection "upgrade";  
	}

proxy_pass 的端口号要写你自己的哦～

完美解决，热更生效

之前看到各种各样的，什么热更没开，需要手动开启热更。或者是启动环境不匹配啥啥的，一顿尝试，统统无效也是很无语。