Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |
Tags
- 디파이방법
- STAKING
- BTC
- transitionGroup
- codingApple
- #Nuxt.js #캡틴판교 #vue.js
- React.memo
- Cake
- nuxt3
- vue.js #v-if #v-show #주니어프론트개발자
- postman #vue #api
- v-model
- github-pages
- vue #npm #vuex #vue-router
- 스왑방법
- React
- prettier
- next13
- Nested Routes
- vue3
- useNuxtAPp
- context api
- useMemo
- githubpages
- Dynamic Routes
- #캡틴판교 #Nuxt.js #인프런 #SSR #CSR
- swap
- nextjs
- Nuxt.js #캡틴판교 #인프런 #복습용도
- draganddrop
Archives
- Today
- Total
내맘대로 frontend 낙서장
React로 만든 플젝 GItHub Pages로 배포하기 본문
Vue랑은 또 다른 배포방법 까먹지 않게 남겨둡니다...
만들고 배포한 Url : https://hyunjunyong.github.io/react-study/
gh-pages 패키지는 사용안함 -> 해보니깐 안되서
1. 일단 repository가 public으로 되면 안됨 사이트 개설해야 되기 때문(유료버전쓰면 모르겠다만은..)
2. package.json에 밑에 처럼 추가 ㄱㄱ
{
"homepage": "https://hyunjunyong.github.io/react-study",
}
이건 내url이니깐 이걸보는사람이 있으면(있을까) 자신의 github page url을 남겨 놓으시길...
3. react-router를 쓰고 있으면 index.js에 다음과 같이 추가
<BrowserRouter basename={process.env.PUBLIC_URL}>
<App />
</BrowserRouter>
// process.env.PUBLIC_URL은 2번에 설정한것과 같은 url임
4. npm run build
5. .gitignore파일에서 /build부분 찾아서 지우던지 주석처리하던지 ㄱㄱ
6. 그다음 add commit push ㄱㄱ
7. 이제 배포해야되기 때문에 build폴더만을 쓸 branch를 만들고 거기에 넣을꺼임
git subtree push --prefix build/ origin gh-pages
8. 이제 github repository에 들어가서 settings -> pages 밑에처럼 설정하면 끝
끝 뭐 별거 없다 간단
'react' 카테고리의 다른 글
next13 강의 들으면서 실습하기 (1) (0) | 2023.04.12 |
---|---|
리액트 기본개념 총 정리 2편 (0) | 2023.04.09 |
리액트 기본개념 총정리 1편 (0) | 2023.04.03 |
리액트 todo에서 만든 drag and drop (0) | 2023.03.31 |
[에러 기록] 풀리지 않는 객체 비교 (0) | 2023.03.30 |