静态网站部署指南

原文由 gpt 生成，经过手工部分整理，主要说明生成静态文件（如 dist）后如何使用 nginx 进行部署。

使用 Nginx 部署静态网站，适用于大多数 Linux 服务器环境。

✅ 步骤一：准备工作

1. 确保你已经有一个服务器（如 Ubuntu / CentOS）。
2. 假设你已经本地生成好了 dist 文件夹（打包后的静态资源）。
3. 确保服务器已安装 Nginx。

✅ 步骤二：安装 Nginx（若尚未安装）

以 Ubuntu 为例：

sudo apt update
sudo apt install nginx

CentOS（使用 yum）：

sudo yum install nginx

✅ 步骤三：上传 dist 文件到服务器

你可以使用 scp 或 rsync 工具将本地的 dist 文件夹上传到服务器，例如：

scp -r ./dist username@your_server_ip:/home/username/

也可以用 FTP 或其它可视化方式上传。

✅ 步骤四：将 dist 目录内容移动到 Nginx 的网站根目录

一般来说，Nginx 的默认网站目录是 /var/www/html，你可以将 dist 目录内容放到那里：

sudo rm -rf /var/www/html/*
sudo cp -r /home/username/dist/* /var/www/html/

✅ 步骤五：配置 Nginx（可选，支持 history 路由等）

编辑 Nginx 配置文件：

sudo nano /etc/nginx/sites-available/default

示例配置：

server {
    listen 80;
    server_name your_domain.com;

    root /var/www/html;
    index index.html;

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

⚠️ 如果是单页应用（SPA）如 Vue Router history 模式，try_files 是必须加的！

✅ 步骤六：重启 Nginx

sudo systemctl restart nginx

✅ 步骤七：防火墙设置（确保 80 端口开放）

Ubuntu 防火墙开放 HTTP：

sudo ufw allow 'Nginx Full'

✅ 完成！

现在访问你服务器的 IP 或绑定的域名，例如：

http://your_server_ip/

应该可以看到你的网站页面了。

---

如果你不想用 Nginx，也可以考虑这些方案：

• 用 python -m http.server 快速部署测试环境（仅限临时访问）
• 使用 Node.js + Express 搭建一个简单静态文件服务器
• 使用 Docker 进行部署
• 使用 GitHub Pages / Vercel / Netlify 做托管（适合公开项目）