方法一：使用 Python 的简单 HTTP 服务器（推荐）

# 1. 首先构建项目
npm run build:local

# 2. 进入 dist 目录
cd dist

# 3. 使用 Python3 启动本地服务器
# Mac 自带 Python3，端口可以自定义（默认 8000）
python3 -m http.server 8000

# 或者指定端口 8080
python3 -m http.server 8080

# 4. 在浏览器中访问
# http://localhost:8000
# 或 http://localhost:8080

方法二：使用 Node.js 的 http-server

# 1. 全局安装 http-server（如果未安装）
npm install -g http-server

# 2. 构建后进入 dist 目录
cd dist

# 3. 启动服务器
http-server -p 8080

# 或启用跨域（如果需要）
http-server -p 8080 --cors

# 4. 访问 http://localhost:8080

方法三：使用 serve 包

# 1. 全局安装 serve
npm install -g serve

# 2. 在 dist 目录或项目根目录运行
serve -s dist -p 3000

# 3. 访问 http://localhost:3000

方法四：用 VSCode 的 Live Server 扩展

1、在 VSCode 中安装 "Live Server" 扩展
2、右键点击 dist/index.html 文件
3、选择 "Open with Live Server"

方法五：直接使用 Nginx（更接近生产环境）

# 1. 安装 Nginx（使用 Homebrew）
brew install nginx

# 2. 配置 Nginx
sudo vim /usr/local/etc/nginx/nginx.conf

# 在 http 块内添加：
server {
    listen       8080;
    server_name  localhost;
    
    location / {
        root   /path/to/your/project/dist;  # 替换为你的实际路径
        index  index.html index.htm;
        try_files $uri $uri/ /index.html;    # 单页应用需要这个
    }
    
    # 如果需要代理 API（解决跨域）
    location /api/ {
        proxy_pass https://zhubo2-api.119you.com/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }
}

# 3. 启动 Nginx
sudo nginx

# 4. 重启 Nginx（修改配置后）
sudo nginx -s reload

# 5. 停止 Nginx
sudo nginx -s stop

方法六：创建简单的 Node.js 服务器脚本

创建 serve-dist.js 文件在项目根目录：

const express = require('express');
const path = require('path');
const app = express();
const port = 3000;

// 静态文件服务
app.use(express.static(path.join(__dirname, 'dist')));

// 支持 History 模式的路由
app.get('*', (req, res) => {
    res.sendFile(path.join(__dirname, 'dist', 'index.html'));
});

// API 代理（如果需要）
const { createProxyMiddleware } = require('http-proxy-middleware');
app.use('/api', createProxyMiddleware({
    target: 'https://zhubo2-api.119you.com',
    changeOrigin: true,
    pathRewrite: {
        '^/api': '/'
    }
}));

app.listen(port, () => {
    console.log(`本地服务器运行在 http://localhost:${port}`);
    console.log('按 Ctrl+C 停止');
});

然后运行：

# 安装依赖
npm install express http-proxy-middleware

# 运行服务器
node serve-dist.js

解决跨域问题的调试配置
由于正式服的 API 域名可能和本地不同，你需要处理跨域问题。修改 build.env.js，为本地调试添加专门配置：

// 在 build.env.js 中添加本地服务器配置
if(['build:local'].includes(process.env.npm_lifecycle_event)) {
    api_url = 'http://local-zhubo-api.119you.com/';
} else if (process.env.VUE_APP_DEBUG === 'true') {
    // 添加调试模式，使用本地代理
    api_url = '/api/';  // 使用本地代理
}

一键启动脚本
创建 start-dist.sh：

#!/bin/bash

echo "构建项目..."
npm run build:zhubo2

echo "启动本地服务器..."
cd dist

# 检查是否安装了 http-server
if command -v http-server &> /dev/null; then
    http-server -p 8080 --cors
elif command -v python3 &> /dev/null; then
    python3 -m http.server 8080
else
    echo "请安装 http-server 或 Python3"
    exit 1
fi

# 给脚本执行权限
chmod +x start-dist.sh

# 运行
./start-dist.sh