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

1、项目打包

npm run build

打包完成后项目路径会多出一个dist文件夹

2、依赖安装

yum -y install gcc
yum install -y pcre pcre-devel
yum install -y zlib zlib-devel
yum install -y openssl openssl-devel

3、Nginx安装

wget http://nginx.org/download/nginx-1.9.9.tar.gz
tar -zxvf nginx-1.9.9.tar.gz
cd /usr/local/web/nginx-1.9.9/
./configure
make
make install

4、切换到Nginx安装目录（默认是/usr/local/nginx）

vim nginx.conf

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

5、启动nginx服务

cd /usr/local/nginx/sbin
./nginx             # 启动
./nginx -s stop   	#停止
./nginx -s quit    	#比较安全的退出
./nginx -s reload 	#刷新重启

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

ps -ef | grep nginx

7、部署问题

问题一：访问提示403
解决：dist项目文件放在  /usr/local 下

问题二：vue 打包 后线上样式错乱，本地环境没问题
解决：1. main.js样式引入顺序问题；2. 加使用范围样式<style scoped>  /deep/原样式