1、切换到服务器的home目录下，并新建文件夹simeple-website-frontend：

    1. cd /home
    2. mkdir simple-website-frontend

    2、在本地的simple-website/frontend/dist目录下执行如下命令，把打包生成的文件放入服务器对应目录下：

    1. scp -r ./* root@服务器ip:/home/youtube-front-pro

    3、修改配置文件/etc/nginx/nginx.conf的部分内容，在http中增加server如下：

    1. http {
    2.     server {
    3.         #  监听47.92.193.196:8080端口
    4.         listen       8080;      
    5.         server_name  47.92.193.196;  
    7.         # 访问 / 时 请求 root下的资源
    8.         location / {
    9.             root   /home/youtube-front-pro; 
    10.             index  index.html index.htm;
    11.             #  解决刷新页面跳404的问题
    12.                         try_files  $uri $uri/ /index.html; 
    13.         }
    16.         error_page   500 502 503 504  /50x.html;
    17.         location = /50x.html {
    18.             root   html;
    19.         }
    20.     }
    21. }

    补充：NGINX部署完项目后刷新就变成404的解决办法

    1.  location / {
    2.       root /www/wwwroot/phm/phmweb;
    3.       index  index.html index.htm;
    4.       try_files  $uri $uri/ /index.html;
    5.   }

    4、nginx服务启动

    1. nginx -t // 检验配置是否正确
    2. nginx -s reload // 重新加载修改的配置
    3. service nginx restart // 重新启动

    之后，访问http://xxx.xxx.xxx.xxx:8080/，看到静态页面 就表示成功啦。
    但此时 还不能正常请求服务端接口 需要下面第5步 完成 nginx 反向代理 才可以
    http://47.92.193.196:8080/

    5、配置nginx 转发 服务端接口

    以后端接口 是http://47.92.193.196:7001 为例

    1. location /api {
    2.    proxy_pass http://47.92.193.196:7001;
    3.    proxy_set_header Host $proxy_host;
    4.    proxy_set_header X-Real-IP $remote_addr;
    5.    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    6. }

    完整配置：

    1. server {
    2.         listen       8080;
    3.         server_name  47.92.193.196;
    5.         location / {
    6.             root   /home/youtube-front-pro;
    7.             index  index.html index.htm;
    8.                       try_files  $uri $uri/ /index.html; 
    9.         }
    12.         error_page   500 502 503 504  /50x.html;
    13.         location = /50x.html {
    14.             root   html;
    15.         }
    17.           # 通过反向代理 去转发后端接口请求， 后端接口 需有api前缀
    18.         location /api {
    19.            proxy_pass http://47.92.193.196:7001;
    20.            proxy_set_header Host $proxy_host;
    21.            proxy_set_header X-Real-IP $remote_addr;
    22.            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    23.         }
    24. }

    此时 访问静态页面 可以正常调用后端接口