📦 GitHub Pages 배포 설정 가이드

import type { NextConfig } from 'next';

const isDev = process.env.NODE_ENV === "development";

const nextConfig: NextConfig = {
  // 🔑 정적 HTML 내보내기 (Static Export)
  output: 'export',
  
  // 🔑 URL 끝에 슬래시 추가 (404 방지)
  trailingSlash: true,
  
  // 🔑 기본 경로 설정 (개발/프로덕션 분리)
  basePath: isDev ? "" : "/cursorAi/gpt",
  
  // 🔑 정적 리소스 경로 설정
  assetPrefix: isDev ? "" : "/cursorAi/gpt/",
  
  // ESLint 빌드 에러 무시
  eslint: {
    ignoreDuringBuilds: true,
  },
  
  // 이미지 최적화 비활성화 (Static Export 필수)
  images: {
    unoptimized: true,
    remotePatterns: [
      {
        hostname: '**',
      },
    ],
  },
};

export default nextConfig;

1️⃣ Next.js Config 설정 (next.config.ts)

각 앱의 404 에러를 방지하기 위한 핵심 설정:

🎯 주요 설정 설명

설정 값 이유
output 'export' 정적 HTML 파일로 내보내기 (GitHub Pages는 정적 사이트만 지원)
trailingSlash true URL 끝에 / 추가하여 404 에러 방지
basePath /cursorAi/gpt GitHub Pages의 서브 경로 설정
assetPrefix /cursorAi/gpt/ JS, CSS 등 정적 리소스의 경로 prefix
images.unoptimized true 이미지 최적화 API 비활성화 (정적 빌드 필수)

2️⃣ Vercel 설정 (vercel.json)

{
"buildCommand": "npm run build",
"outputDirectory": "out",
"framework": "nextjs",
"installCommand": "npm install"
}

🎯 주요 설정 설명