本文共 1460 字，大约阅读时间需要 4 分钟。

1、安装Nginx

• 我使用的是yum安装。（当然也可以自己下载手动安装）。输入命令查看yum上的nginx可用安装包

  yum list | grep nginx

  

• 安装nginx。yum -y install nginx

  
  直到出现Complete！

• 启动nginx systemctl start nginx

• 查看nginx状态systemctl status nginx

  
  正在运行。安装完成。

2、build Vue项目

• 生成dist文件
  右键Vue项目→外部命令→npm run build→生成dist文件
• 上传dist文件
  使用rz工具或者Xftp工具，将dist文件上传到Linux系统。文件位置根据自己需要。也可以自定义文件名。(例如 /home/project/test)

3、部署Vue项目

• 首先，找到nginx的配置文件nginx.conf
  在启动nginx查看其状态时
  
  我们可以看到配置文件的路径。
  当然我们也可以全局搜索find / -name nginx.conf
  
• 进入配置文件所在位置后打开配置文件 nginx.conf。为了简单操作，我直接使用xftp来操作了
  主要对server进行配置

  server {
               listen       8806; 							#监听端口设置，也就是你vue项目的端口        server_name  localhost;						        # Load configuration files for the default server block.        include /etc/nginx/default.d/*.conf;                location / {
       			root		/home/project/test;			#前端dist文件夹存放路径   			try_files $uri $uri/ /index.html;		#解决页面刷新报404错误        }        location /prod-api/{
       						#匹配/prod-api/			proxy_pass http://你的IP:你的端口/;		#跳转至后端的接口        }        error_page 404 /404.html;            location = /40x.html {
               }        error_page 500 502 503 504 /50x.html;            location = /50x.html {
               }    }

  配置完成！启动nginx就可以访问了。

4、Linux系统安全策略配置

OK！小编以为已经搞定了！访问的时候，却报错了！

• 找到文件/etc/selinux/config

  

• 打开文件config

  
  其中enforcing，permissive，disabled是Linux系统安全策略的三种模式。安全程度enforcing>permissive>disabled。小编没有做深入研究。。。

• 修改配置文件

  只要把SELINUX=enforcing改为SELINUX=permissive即可。（当然改成disabled更可以）

• 重启系统。启动nginx。

  发现此时项目可以正常访问了！

转载地址：http://fqvti.baihongyu.com/