云服务器部署前端静态资源文件

双十一前夕，花费 85 元买了一年的百度云服务器，终于有机会玩弄自己的服务器了。作为一个前端，之前也没搞过这玩意，特此记录。

一. 远程登录云服务器

方法一：点击 VNC 远程登录按钮
方法二：使用 MobaXterm 远程登录（推荐使用这个）

二. 利用 Nginx 搭建静态资源服务器

安装 nginx

yum install nginx

启动 nginx

service nginx start

查看是否启动成功

service nginx status

三. 上传资源文件

以我本地的 react 项目工程为例，打包编译（Vue、Angular 或单纯的.html 文件都可以）

npm run build

将打包好的资源文件上传到 home 文件夹下（上传方式：拖拽或者点击 上传按钮）

四. 配置 nginx 代理

进入 nginx 配置文件目录，找到 nginx.conf 文件

cd /etc/nginx/

打开配置文件

vim nginx.conf

配置代理

    server {
        listen       80 default_server;
        listen       [::]:80 default_server;
        server_name  此处配置服务器 IP;
        root         /usr/share/nginx/html;

        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;
        # 静态资源文件
        location / {
         # 静态资源存放路径
         root /home/;
         index index.html index.htm;
        }

        error_page 404 /404.html;
            location = /40x.html { }

        error_page 500 502 503 504 /50x.html;
            location = /50x.html {}}

重启 nginx

nginx -s reload

五. 打开浏览器，输入服务器 IP（大功告成）