宝塔面板部署 Nuxt.js 项目完整教程（SSR/SSG模式）

一、环境准备

1.1 服务器配置

• 操作系统：推荐 CentOS 7+/Ubuntu 18.04+
• 配置要求：至少 1核 2G 内存（SSR模式需要更高配置）
• 开放端口：确保服务器开放 80/443 端口（HTTP/HTTPS）

1.2 安装宝塔面板

# CentOS
yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && sh install.sh

# Ubuntu
wget -O install.sh http://download.bt.cn/install/install-ubuntu_6.0.sh && sudo bash install.sh

安装完成后记录面板地址、账号密码，登录后安装以下软件：

• Nginx 1.20+
• Node.js 16+ （建议通过「软件商店-Node版本」安装）
• PM2管理器

---

二、项目部署流程

2.1 上传项目文件

1. 将本地项目打包（排除 node_modules）：

   tar -zcvf nuxt-project.tar.gz --exclude=node_modules .
   

2. 通过宝塔「文件」功能上传到服务器目录（如 /www/wwwroot/nuxt-app）

2.2 安装依赖

cd /www/wwwroot/nuxt-app
npm install --production

2.3 构建项目

SSR模式：

npm run build

SSG静态生成模式：

npm run generate

---

三、服务配置

3.1 PM2进程守护

1. 打开宝塔「PM2管理器」

2. 添加新项目：

   • 启动文件：npm
   • 运行目录：选择项目目录
   • 启动参数：run start（SSR模式）或 run start:static（SSG模式）

3.2 Nginx配置

1. 通过宝塔创建新站点（需提前解析域名）
2. 修改站点配置文件：

server {
    listen 80;
    server_name yourdomain.com;
    
    # SSR模式代理
    location / {
        proxy_pass http://127.0.0.1:3000; # Nuxt默认端口
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }

    # SSG静态模式配置
    # root /www/wwwroot/nuxt-app/dist;
    # index index.html;
}

3.3 HTTPS配置

1. 在宝塔「SSL」菜单申请Let's Encrypt证书
2. 强制开启HTTPS
3. 修改Nginx配置自动跳转HTTPS

---

四、常见问题解决

4.1 端口占用问题

# 查看端口占用
lsof -i :3000
# 结束进程
kill -9 <PID>

4.2 内存不足处理

• 添加SWAP分区：

  dd if=/dev/zero of=/swapfile bs=1M count=2048
  mkswap /swapfile
  swapon /swapfile
  

4.3 文件权限问题

chown -R www:www /www/wwwroot/nuxt-app
chmod -R 755 /www/wwwroot/nuxt-app

---

五、高级优化

5.1 自动部署方案

1. 配置Git仓库Webhook

2. 创建部署脚本：

   #!/bin/bash
   git pull origin master
   npm install
   npm run build
   pm2 restart nuxt-app
   

5.2 性能调优

1. 开启Nginx Gzip压缩
2. 配置浏览器缓存
3. 使用CDN加速静态资源

---

六、部署验证

访问域名后，可通过以下方式验证：

1. 查看页面源代码确认服务端渲染（SSR模式）

2. 检查 /etc/nginx/sites-enabled 配置

3. PM2日志查看：

   pm2 logs nuxt-app
   

---

注意事项：

1. 生产环境建议使用 nuxt.config.js 配置 target: 'server' 或 target: 'static'
2. 建议使用 .env 文件管理环境变量
3. 定期通过 pm2 save 保存进程列表

通过以上步骤即可完成Nuxt项目在宝塔面板的部署，如有其他问题欢迎留言讨论！