프로젝트 내에서
npm i gh-pages
package.json 파일 확인 --> scripts의 build
build를 하게 되면 프로젝트의 production ready code를 실행하게 됨
이것은 파일 최적화를 시키는 과정임
npm run build
코드를 실행하고 나면 최상단에 build 파일 생성됨
--> 안에 있는 파일은 압축된 폴더임
{
"name": "react-project",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"gh-pages": "^4.0.0",
"prop-types": "^15.8.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^5.3.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
// 여기도 추가
"deploy": "gh-pages -d build",
"predeploy": "npm run build"
// deploy 할 땐 build를 먼저 해줘야하기 때문에
// deploy가 실행되면 predeploy 가 먼저 실행되서 자동 build를 해줌
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
// 이 부분 추가해줬음, io뒤에 내용이 뭔지 모르겠다면 git remote -v를 해보면 뒤에 나옴
// github id 적어주면 됨
// git config --global user.name 했을 때 나오는 이름--> 아니었음 깃헙 닉네임으로
"homepage": "https://min-ji07.github.io/react-project"
}
npm run deploy
https://min-ji07.github.io/react-project/
짜잔
'개발' 카테고리의 다른 글
[node.js] 공부 시작 2 (Express 라이브러리 설치하기, Manifest Error) (0) | 2022.11.22 |
---|---|
[node.js] 공부 시작 (0) | 2022.11.22 |
[Github] github api key 숨기기 (React) (0) | 2022.11.22 |
[typeScript] 변수에 type 할당하기 (0) | 2022.06.10 |