Deploying to github pages (React, Vue)

 < React의 경우 > 

yarn add --dev gh-pages @types/gh-pages

"scripts": { ... "predeploy": "yarn build", "deploy": "gh-pages -d build" }

"homepage": "https://ID.github.io/repo명"

in package.json

 

yarn deploy

https://create-react-app.dev/docs/deployment/#github-pages

 

 < Vue의 경우 > 

vue.config.js파일에 publicPath:"/git repo name" , outputDir: "./docs" 로 설정하고

pages설정시 root가 아닌 ./docs폴더로 경로를 잡아준다

shell파일을 만들어서 실행시키면 배포완료!

set -e

npm run build

cd docs

# git init
git add -A
git commit -m  "commit message"
git push -f git주소 main:gh-pages

cd -

pacakge.json에 scripts에 sh deploy.sh명령어를 등록 후 사용하면 편하다.