Mac → GitHub → VPS → Nginx → 公网访问：一次完整的静态站点部署记录

第 3 步：配置 Nginx

3.1 复制文件到 Nginx 目录

mkdir -p /var/www/project-dashboard
cp -r dist/* /var/www/project-dashboard/

3.2 创建 Nginx 配置

cat > /etc/nginx/sites-available/project-dashboard.conf << 'EOF'
server {
    listen 3004;
    server_name _;
    root /var/www/project-dashboard;
    index index.html;

    location / {
        try_files $uri $uri/ /index.html;
    }
}
EOF

关键点：

• 端口 3004（选择未占用的端口）
• root 指向静态文件目录
• try_files 处理 SPA 路由（找不到文件就返回 index.html）

3.3 启用配置

# 软链接到 sites-enabled
ln -sf /etc/nginx/sites-available/project-dashboard.conf /etc/nginx/sites-enabled/

# 测试配置
nginx -t

# 重新加载
systemctl reload nginx

3.4 验证（VPS 本地）

# 端口是否监听
ss -tlnp | grep ":3004"

# HTTP 状态
curl -sI http://127.0.0.1:3004/ | head -3

# 页面标题
curl -s http://127.0.0.1:3004/ | grep -oE "<title>[^<]*</title>"

预期输出：

LISTEN 0.0.0.0:3004 ...
HTTP/1.1 200 OK
Server: nginx/1.18.0 (Ubuntu)
<title>Project Workspace</title>