前端打包部署

前言

    第一次在公司部署前端vue打包好的dist

准备工作

1.   连接服务器，我使用的xshell。

     2.  如何将dist包上传到xshell。

• 点击箭头所指图标，如果没有xftp软件，会自动跳转到官方页面，你可以去获得免费的xftp。
• 下载安装完成后，再点击这个图标。

• xftp页面如下，将左边本地的文件直接拖拽到右边，就直接上传到服务器该目录下。

    3.   查看服务器是否有nginx，如果出现如下界面，则代表已安装nginx

  查看nginx配置文件,放在/etc/nginx下

查看nginx.conf

cat nginx.conf

 不建议直接修改nginx.conf，找到其他server存放的目录，切换到该目录下

新增server 

切换到conf.d目录，并新增temp.conf(自己随便命名，但后缀为.conf)

编辑新增配置文件

vi temp.conf

内容如下 

server {
  listen 8080;
  server_name localhost;
  location / {
    root /home/ganyuping/data/vue/template_editor/dist;
    index index.html;
    try_files $uri $uri/ /index.html;
  }

  location  /api {
    #rewrite /api/(.*)$ /$1 break;
    proxy_pass http://127.0.0.1:6482;
    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;
  }
}

 注意 localhost建议不要修改

 检查配置是否有问题

nginx -t

出现下面这2句话 ，表示配置成功

    1.语法

    2.测试

nginx: the configuration file /etc/nginx/nginx.conf syntax is ok

nginx: configuration file /etc/nginx/nginx.conf test is successful

open() "/var/run/nginx.pid" failed (13: Permission denied)： 这个错误是由于 Nginx 进程没有足够的权限访问 /var/run/nginx.pid 文件导致的

可以使用 sudo 命令以超级用户权限来执行 nginx -t 命令。

sudo nginx -t

重启，让配置生效 

nginx -s reload