github 로 배포하기

 

gihhub 레파지토리에

push 해둔 프로젝트를 배포하는 방법

 

• gh-pages 모듈 설치

npm install gh-pages --save-dev

 

• package.json 설정

"homepage" : "https://깃헙아이디.github.io/레파지토리 이름"

 

"scripts"내

    "predeploy": "npm run build"

    "deploy" : "gh-pages -d build"

 

추가

 

 

• build를 이용해서 배포

npm run deploy

↓

 

<Succes Message>

 

> react-tictactoe-app-functional@0.1.0 predeploy
> npm run build  build를 먼저 실행해서 코드 최적화를 먼저 시키고


> react-tictactoe-app-functional@0.1.0 build
> react-scripts build

Creating an optimized production build...
One of your dependencies, babel-preset-react-app, is importing the
"@babel/plugin-proposal-private-property-in-object" package without
declaring it in its dependencies. This is currently working because
"@babel/plugin-proposal-private-property-in-object" is already in your
node_modules folder for unrelated reasons, but it may break at any time.

babel-preset-react-app is part of the create-react-app project, which
is not maintianed anymore. It is thus unlikely that this bug will
ever be fixed. Add "@babel/plugin-proposal-private-property-in-object" to
your devDependencies to work around this error. This will make this message
go away.
  
Compiled successfully.

File sizes after gzip:

  48.71 kB  build/static/js/main.d7ad184d.js 
  1.78 kB   build/static/js/453.71fd4431.chunk.js
  836 B     build/static/css/main.6a060835.css

npm run build하면 코드가 최적화 되어 static 폴더 안에 생긴 js, css 파일들.

The project was built assuming it is hosted at /react-budget-deploy-test-app/.
You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.

Find out more about deployment here:

  https://cra.link/deployment


> react-tictactoe-app-functional@0.1.0 deploy
> gh-pages -d build

Published

 

 

• 배포한 사이트 url 확인

package.json에 "homepage" : url 에 작성한 url을 통해 들어가보기

https://wonjichoe.github.io/react-budget-deploy-test-app