[1] 编译Vue项目成dist文件夹
输入打包Vue项目语句：
npm run build:prod
打包完成后，shell提示如下：
然后在项目中，会出现一个dist文件夹：
[2] 把dist文件夹上传到服务器
我的路径如下：
[3] 增加配置服务器的nginx
配置代码如下：
server { listen 80; server_name localhost; location / { root /www/wwwroot/blueele/dist; try_files $uri $uri/ /index.html; index index.html index.htm; } location /prod-api/{ proxy_set_header Host $http_host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_pass http://localhost:8080/; } location /dev-api/{ proxy_set_header Host $http_host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_pass http://localhost:8080/; } error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } }
代码中，配置了访问前端工程的端口为默认80；
配置根目录/www/wwwroot/blueele/dist;要写自己的路径。
其他地方不用改变。
[4] 访问
最后，只需要输入自己的域名或者IP即可访问Vue页面。
