一、项目环境准备
1、安装宝塔面板
如果你还没有安装宝塔面板，可以在官网上进行下载并按照官方文档进行安装，宝塔面板是一款非常好用的服务器运维工具。
2、安装nodejs环境
在宝塔面板中的软件商店中找到nodejs并且按照提示进行安装，nodejs需要最好选择最新的稳定版本。
3、安装vue-cli脚手架
在终端中执行命令：npm install -g vue-cli，以全局方式安装vue-cli脚手架，vue-cli可以快速构建出vue项目的基础环境。
4、安装git
在宝塔面板中的软件商店中找到git并且按照提示进行安装，git需要用于从代码仓库进行代码的拉取。
二、拉取vue项目代码
将vue项目代码通过git进行拉取，这里以github为例：
git clone https://github.com/user/repo.git
如果没有将代码放到指定目录下，那么需要进入到项目目录下执行以下命令：
cd repo
三、安装依赖
在项目目录下执行以下命令，安装所需依赖包：
npm install
通常情况下，这个过程会耗费一些时间，请保持耐心。
四、打包项目文件
在项目目录下执行以下命令，打包项目：
npm run build
完成后，会在项目目录下生成一个/dist目录，里面包含了最终生成的静态文件。
五、创建站点并上传项目文件
在宝塔面板中，选择网站->添加网站，输入网站相关信息，确认后即可创建站点。
进入站点后，选择文件管理器->web目录，创建一个新的目录用于存放vue项目文件。
将刚才打包生成的静态文件进行上传，并将文件的权限设置为www:www。
六、配置nginx反向代理
在宝塔面板中，选择站点->反向代理，添加一个新的反向代理规则：
代理名称: vue 代理协议: http 代理目录: / 目标URL: http://127.0.0.1:port or 主机ip:port
按照以上规则进行配置后，提交即可生效。
七、配置nginx转发策略
在宝塔面板中，选择站点->配置文件，找到nginx.conf文件进行编辑。打开文件后，将以下代码添加到http块中：
location / {
proxy_pass http://127.0.0.1:port or 主机ip:port;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
按照以上规则进行配置后，提交即可生效。
八、启动项目
在项目目录下执行以下命令，启动项目：
npm run start
如果需要使用pm2进行管理，那么可以执行以下命令进行安装：
npm install -g pm2
直接使用pm2启动项目：
pm2 start npm --name "vue-demo" -- start
总结
以上就是宝塔部署vue项目的详细流程，按照以上步骤进行操作，基本上可以在几分钟的时间内完成vue项目的部署工作。但是需要注意的是，以上过程中可能会遇到一些问题，遇到问题的时候需要多看一看官方文档或者询问其他开发者的意见。希望这篇文章能够对vue开发者在宝塔上部署vue项目有所帮助。
