Nginx 部署 Vue 项目报 500 错误

今天在阿里云的 Ubuntu 上部署一个 Vue 项目，使用 Nginx 做代理，端口能正常访问，但 Nginx 一直响应是 500。

后来发现是 Nginx 访问不了 dist 文件夹，权限的问题，因为我把 dist 放在了 /root 目录下面，但 Nginx 不能访问 /root。

之后将 dist 放在 /var 目录下，问题就解决了。

下面是我的 Nginx 配置文件/etc/nginx/sites-enable/default：

server {
        listen 8444 default_server;	# 端口
        server_name 116.x.x.x;		# 服务器地址

		# 路径 http://116.x.x.x:8444/ 的映射设置
        location / {
                root /var/.../.../dist;  	# dist目录
                index index.html;			# 访问
                try_files $uri $uri/ /index.html;
        }
}

记录：一些部署过程中的问题

Vue 是前端项目，http 请求后端数据会有 proxy 代理，存在跨域的问题，一般还会在上面的配置多加一条：

		# x.x.x.x:8443/api 映射到 x.x.x.x:8443/
		location /api {
                proxy_pass http://localhost:8443/;
       	}

我这里的前后端进程是在一台服务器上，所以直接使用 localhost 了。

---

正文结束，希望帮到你。有问题欢迎留言，喜欢的话就点一下赞吧。