1.部署Nginx
请参考Linux下部署nginx,此处不再重复
2.Vue项目打包
# 打包正式环境 npm run build:prod # 打包预发布环境 npm run build:stage
3. 部署时可能会发现资源路径不对 ,只需修改 vue.config.js下 文件资源路径
# 请根据自己路径来配置更改 publicPath: './'
4. 将打包后的dist文件夹上传至服务器
本次项目路径为 /usr/local/webapp/
5.修改Nginx的conf文件
nginx -t 查看nginx.conf 文件的路径
vim /usr/local/nginx/cong/nginx.conf #修改如下 server { listen 80; server_name localhost; # 注意设定 root路径是有dist的 location / { root /usr/local/webapp/dist; index /index.html; } #跨域 ip和port自行替换 location /adminApi { proxy_pass http://ip:port; } }
6. 使配置生效
sbin/nginx -s reload sbin/nginx -s stop sbin/nginx