Numble '다른 색깔 찾기 게임 제작 챌린지' -4 (배포)

이제 조금 덕지덕지하지만... 어쨌든 완성된 코드를 배포해서 다른 사람들이 볼 수 있도록 해야한다.

배포에는 github page를 이용하기로 했다.

 

1. 프로젝트에 gh-pages 패키지 설치

npm install gh-pages --save-dev

 

2. pagkage.json에 homepage 항목 추가

"homepage": "http://사용자계정이름.github.io/저장소이름"

 

2. package.json의 scripts 부분 수정

  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    
    //아래 2줄을 추가한다
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build"
  },

 

3. 커맨드 창에 npm run deploy 입력 후, 성공하면 Published 되었다고 뜬다.

npm run deploy

 

4. github > 프로젝트 > settings > pages에서 브랜치가 아래와 같이 gh-pages로 잘 바뀌었는지 확인한다.

 

 

처음 시도했을 땐 404 에러로 빈 페이지가 떴는데,

1) npm run build 후 npm run deploy 입력

2) package.json파일의 homepage 설정에서 https://...를 http://...로 수정

 

했더니 잘 떴다. 둘 중에 어떤 게 영향을 미친 건지 확실치 않지만 아마 2번 때문이 아니었을까 추측한다...