Merk Korea PDA 배포 가이드

1. 로컬 빌드 및 실행

빌드

npm install
npm run build

빌드 결과물은 dist/ 폴더에 생성됩니다.

로컬에서 빌드 결과 확인

npm run preview

http://localhost:4173 에서 확인 가능

2. Docker로 배포

이미지 빌드

docker build -t merk-korea-pda .

컨테이너 실행

docker run -d -p 80:80 --name merk-pda merk-korea-pda

http://localhost 에서 확인 가능

컨테이너 중지/삭제

docker stop merk-pda
docker rm merk-pda

3. Docker Compose (선택)

docker-compose.yml 파일 생성:

version: '3.8'
services:
  web:
    build: .
    ports:
      - "80:80"
    restart: unless-stopped

실행:

docker-compose up -d

4. 정적 파일 직접 배포

dist/ 폴더를 웹 서버에 업로드하면 됩니다.

주의사항

React Router(SPA)를 사용하므로, 모든 경로를 index.html로 리다이렉트 설정 필요:

Nginx 예시:

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

Apache 예시 (.htaccess):

RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]

5. 포트 변경

Docker 포트 변경

docker run -d -p 3000:80 --name merk-pda merk-korea-pda

→ http://localhost:3000 에서 접근

Vite 개발 서버 포트 변경

vite.config.ts에서 설정:

export default defineConfig({
  server: {
    port: 3000
  }
})

1.6 KiB Raw Permalink Blame History