我们使用Vue做项目时，基本都是前后端分离的，所以项目布署有时是前后单独部署。因此前端开发人员很有必要熟悉一下项目部署的流程。

Vue项目打包部署本身不复杂，不过一些前端同学可能对服务器接触不多，部署过程中还是会遇到这样那样的问题。本文介绍一下使用nginx服务器代理前端项目的方法以及项目部署的相关问题。

一、准备工作——服务器和nginx使用

二、Vue项目打包并同步文件到服务器

1、打包

一般情况下，使用vue-cli创建的项目，package.json里的script应该已经配置了build指令，直接执行

yarn build

或者

npm run build

`build`命令默认是打包生产环境，如果想指定环境可以这样配置：

"build:stage": "vue-cli-service build --mode staging",// 测试环境
"build:prod": "vue-cli-service build --mode production", // 生产环境

npm run build:stage  测试环境打包
npm run build:prod  生产环境打包

2. 同步到远程服务器