Vue项目打包部署到服务器（Linux）

一、打包（build） npm run build / yarn build 打包完成后项目路径会多出一个dist文件夹 到这里本地的打包完成了 然后到服务器 二、服务器配置（nginx）

**注：如果已经有nginx环境了的话直接到第6小步**

1、查看gcc版本 gcc -v 没有的话安装

yum -y install gcc
复制代码

2、pcre、pcre-devel安装 pcre是一个perl库，包括perl兼容的正则表达式库，nginx的http模块使用pcre来解析正则表达式，所以需要安装pcre库。

yum install -y pcre pcre-devel
复制代码

3、zlib安装zlib库提供了很多种压缩和解压缩方式nginx使用zlib对http包的内容进行gzip，所以需要安装

yum install -y zlib zlib-devel
复制代码

4、安装opensslopenssl是web安全通信的基石，如果没有openssl，我们的信息可以说都是在裸奔。。。。。。 安装命令：

yum install -y openssl openssl-devel
复制代码

5、安装nginx 去到一个文件夹cd /usr/local/web a、下载nginxwget nginx.org/download/ng… b、解压压缩包tar -zxvf nginx-1.9.9.tar.gz c、切换到cd /usr/local/web/nginx-1.9.9/下面执行三个命令： 1. ./configure 2. make 3. make install

Nginx安装成功

如果已经安装了的可以直接从第6步(这一步)开始

6、切换到nginx安装目录（默认是/usr/local/nginx） 可以执行where nginx查看

修改nginx文件夹里的nginx.conf修改默认配置， 默认配置已经够用了基本只需要修改一下端口和路径， 默认端口是80，一般都是已经被占用了的，改成其它自己需要的 然后路径是刚刚打包的dist文件的路径 最基础的配置（如果已经有其他项目在nginx里了也可以直接在http{里面再加上这一段}）

server {        
		listen       8080;        
		server_name  project1;        
		location / {            
			root   edu/dist; #dist路径           
		 	index  index.html index.htm;       
		  }    
}
复制代码

7、启动nginx服务切换目录到/usr/local/nginx/sbin下面 执行./nginx启动 其它nginx命令

./nginx -s stop   	#停止
./nginx -s quit    	#比较安全的退出
./nginx -s reload 	#刷新重启
复制代码

8、查看nginx服务是否启动成功

ps -ef | grep nginx
复制代码

然后开放端口（开放端口的操作这里就略啦——云服务器的去对应平台设置安全组里添加） 不出意外的话执行你的ip或者域名：10.0.xx.xx:8080就可以访问到你的项目了

接下来则可以开始进入CICD的进阶方式；实现持续部署