宝塔面板部署node+vue项目
时间: 2025-02-18 22:07:54 浏览: 65
### 宝塔面板部署 Node.js 和 Vue 组成的全栈项目
#### 准备工作
确保已经安装并配置好了宝塔面板,同时拥有对服务器的访问权限。对于华为云耀服务器而言,通过Xshell或其他SSH客户端进行远程连接操作。
#### 创建站点与环境设置
在宝塔面板中创建一个新的网站域名,并为其指定根目录位置。接着,在软件商店内分别安装Node.js运行环境以及Nginx作为反向代理服务来处理HTTP请求转发给对应的前端或后端应用[^2]。
#### 后端 Nest.js 的部署
下载并解压后端源码至服务器上的特定文件夹下(例如`/www/wwwroot/backend`),利用PM2进程管理器启动Node.js应用程序以保持其稳定在线状态。具体命令如下所示:
```bash
cd /www/wwwroot/backend
npm install
pm2 start npm --name "backend" -- start
```
为了使该后台API能够被外部网络正常访问,则需编辑防火墙规则开放相应的TCP端口;另外还需调整Nginx配置使得它能将带有特定前缀路径(比如/api)的URL路由重定向至此处监听的服务实例之上[^1]。
#### 前端 Vue 项目的构建与发布
进入存放前端工程的地方执行生产模式下的资源打包指令,这会生成一个名为`dist`的新子目录用于存储静态网页资产文件。之后把上述产物复制粘贴到先前定义好的WebRoot路径下面即可完成初步展示页面的工作[^3]。
```bash
cd /www/wwwroot/frontend
npm run build
cp -r dist/* /www/server/nginx/html/
```
考虑到实际应用场景中的跨域资源共享(CORS)问题,建议修改Nginx设定允许来自不同来源地发起AJAX调用请求的同时也指明正确的CORS头信息字段值[^4]。
---
阅读全文
相关推荐


















