部署指南

本指南将介绍如何将 MultiSite 部署到不同的平台和环境。

构建准备

在部署之前，确保您的项目已经准备就绪：

1. 环境变量配置

创建生产环境的环境变量：

NEXT_PUBLIC_SITE_URL=https://your-production-domain.com
NEXT_PUBLIC_DEFAULT_LANG=zh-CN
NODE_ENV=production
2. 构建测试
在本地测试生产构建：

npm run build
npm run start
Run command
3. 性能优化
确保已启用所有性能优化选项：

// next.config.mjs
const nextConfig = {
  output: 'export', // 静态导出
  trailingSlash: true,
  images: {
    unoptimized: true // 静态导出时需要
  }
};
Vercel 部署
Vercel 是部署 Next.js 应用的最佳选择。

1. 通过 Git 部署
将代码推送到 GitHub/GitLab/Bitbucket
在 Vercel 创建账户
导入您的仓库
配置环境变量
部署
2. 通过 CLI 部署
# 安装 Vercel CLI
npm i -g vercel

# 登录
vercel login

# 部署
vercel --prod
Run command
3. 自定义域名
在 Vercel 控制台中：

进入项目设置
点击 "Domains"
添加您的自定义域名
配置 DNS 记录
Netlify 部署
1. 构建配置
创建 netlify.toml：

[build]
  command = "npm run build"
  publish = "out"

[build.environment]
  NODE_VERSION = "18"

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200
2. 部署步骤
在 Netlify 创建账户
连接您的 Git 仓库
配置构建设置
部署
传统服务器部署
1. 使用 PM2
# 安装 PM2
npm install -g pm2

# 构建项目
npm run build

# 启动应用
pm2 start npm --name "multisite" -- start

# 保存 PM2 配置
pm2 save
pm2 startup
Run command
2. Nginx 配置
server {
    listen 80;
    server_name your-domain.com;

    location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_cache_bypass $http_upgrade;
    }
}
3. SSL 配置
使用 Let's Encrypt：

# 安装 Certbot
sudo apt install certbot python3-certbot-nginx

# 获取 SSL 证书
sudo certbot --nginx -d your-domain.com

# 自动续期
sudo crontab -e
# 添加: 0 12 * * * /usr/bin/certbot renew --quiet
Run command
Docker 部署
1. Dockerfile
FROM node:18-alpine AS base

# 安装依赖
FROM base AS deps
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm ci --only=production

# 构建应用
FROM base AS builder
WORKDIR /app
COPY . .
COPY --from=deps /app/node_modules ./node_modules
RUN npm run build

# 运行时
FROM base AS runner
WORKDIR /app
ENV NODE_ENV production

RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nextjs

COPY --from=builder /app/public ./public
COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static

USER nextjs

EXPOSE 3000
ENV PORT 3000

CMD ["node", "server.js"]
2. Docker Compose
version: '3.8'
services:
  multisite:
    build: .
    ports:
      - "3000:3000"
    environment:
      - NODE_ENV=production
      - NEXT_PUBLIC_SITE_URL=https://your-domain.com
    restart: unless-stopped
CDN 配置
1. Cloudflare
添加您的域名到 Cloudflare
配置 DNS 记录
启用 CDN 和缓存
配置 SSL/TLS
2. 缓存策略
// next.config.mjs
const nextConfig = {
  async headers() {
    return [
      {
        source: '/images/:path*',
        headers: [
          {
            key: 'Cache-Control',
            value: 'public, max-age=31536000, immutable'
          }
        ]
      }
    ];
  }
};
监控和分析
1. 性能监控
// 添加到 _app.tsx
export function reportWebVitals(metric) {
  if (metric.label === 'web-vital') {
    console.log(metric);
    // 发送到分析服务
  }
}
2. 错误监控
集成 Sentry：

npm install @sentry/nextjs
Run command
// sentry.client.config.js
import * as Sentry from '@sentry/nextjs';

Sentry.init({
  dsn: 'YOUR_DSN_HERE',
  environment: process.env.NODE_ENV
});
部署检查清单
 环境变量已配置
 构建成功无错误
 性能优化已启用
 SSL 证书已配置
 CDN 已设置
 监控已集成
 备份策略已制定
 域名已配置
 SEO 设置已完成
恭喜！您的 MultiSite 应用现在已经成功部署到生产环境。

4.5 KiB Raw Permalink Blame History Unescape Escape

部署指南

构建准备

1. 环境变量配置

4.5 KiB

Raw Permalink Blame History