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/原样式