# 22-08-01

# Docusaurus 배포하기

# Docusaurus 설치

npx create-docusaurus@latest my-website classic

위 명령어로 현재 위치 하위에 my-website라는 이름의 디렉토리 아래에 설치된다.(classic템플릿 으로 설치)

# 배포 🚀

공식문서 (opens new window)를 통해 Vercel, Netlify로 배포 해 보기

# 🚀 Vercel로 배포하기

Vercel (opens new window)에서 GitHub repository를 연결하여 배포할 수 있다.

  • docusaurus.config.jsurl을 배포할 Vercel 주소와 동일하게 설정하지 않아도 배포된다.
  • 기본 주소는 {레포지토리이름}.vercel.app으로 지정된다.

# Branch

  • 첫 배포시(등록시) GitHub에서 Default branch로 지정된 branch가 배포된다.
  • branch에 push되면, 자동으로 배포되도록 설정할 branch 변경
    • Project Settings - Git - Production Branch에서 변경 production branch 변경

# Routing

  • 아무 설정 없이 docusaurus.config.jsbaseUrl만을 변경하여 테스트
    • baseUrl을 /test/와 같이 설정하는 경우, /로 접속시 오류 메시지 표시됨
    • Docusaurus는 기본적으로 라우팅을 지원 (opens new window)한다.
    • blog, docs, pages등 플러그인을 통하여 파일경로에 따라 URL 경로를 지정할 수 있다.

# 🚀 Netlify로 배포하기

공식문서 (opens new window)를 토대로 docusaurus.config.js의 url을 지정 후 Netlify에서 GitHub repository를 연결한다.

  • Vercel과 달리 첫 배포시에도 어떤 브랜치를 대상으로 deploy를 수행할지(Production branch)를 선택할 수 있다.

주의사항

Post Processing > Asset Optimization > Pretty Urls 설정을 비활성화 체크해주는 것을 권장합니다.

위 주의사항을 공식문서에서 확인할 수 있는데, 아래와 같이 기본적으로 disabled 상태였다.

설정 화면