vue项目部署到centos7.6服务器（使用nginx）

一、vue前端代码准备工作：

1、目录结构

2、在 npm run build 之前 将/src/config/index.js文件中的 assetsPublicPath: '/', 改为 assetsPublicPath: './',否则当打开页面时会出现空白页的情况。

3、若项目使用的elementUI，编译后可能会出现elementUI自带icon变为小方框情况，解决办法：修改/src/build/utilutils.js 文件，在执行 npm run build

4、将编译后的dist文件夹压缩上传到服务器某目录下。

二、服务器准备及部署

1、在服务器上安装 nginx

2、nginx常用命令

    （1）启动、停止、重载命令

      systemctl start nginx.service

      systemctl stop nginx.service

      systemctl reload nginx.service

      systemctl status nginx.service

   （2）查看nginx的状态及进程与端口（启动后）

      命令1：systemctl status nginx.service

      命令2：netstat -antp | grep :80（查看80端口被哪个服务占用）or netstat -antpuel  | grep ":22" | grep  -v grep（过虑grep本身）

    

 

    命令3：netstat -antp | grep :（查看所有端口占用情况）

    

   

　命令4：ps aux | grep nginx（查看nginx进程运行状态）or ps aux | grep :80 | grep -v grep（过虑grep本身）

    

 

（3）杀掉进程命令

    a)相关nginx进行全部杀掉：killall -9 nginx  

    b)把PID两个进程杀掉：kill -9 pid1 and kill -9 pid1 

 

（4）查看版本

   命令：nginx -V