CRA 세팅 시 기본 파일 정보

 

 

 

새롭게 프로젝트를 세팅하다가 발견한 파일들,,

기존에 세팅할 땐 지우기만했는데 이번엔 궁금해져서 찾아보았다.

 

 

---

 

 

public

• manifest.json: PWA에 필수적으로 포함되어야하는 파일이다.

{
  "short_name": "React App", // 사용자 홈 화면에서 아이콘 이름으로 사용
  "name": "Create React App Sample", // 웹앱 설치 배너에 사용
  "icons": [ // 홈 화면에 추가할 때 사용
    {
      "src": "favicon.ico",
      "sizes": "64x64 32x32 24x24 16x16",
      "type": "image/x-icon"
    },
    {
      "src": "logo192.png",
      "type": "image/png",
      "sizes": "192x192"
    },
    {
      "src": "logo512.png",
      "type": "image/png",
      "sizes": "512x512"
    }
  ],
  "start_url": ".", // 웹앱 실행 시 시작되는 URL 주소
  "display": "standalone", // 디스플레이 유형(fullscreen, standalone, browser)
  "theme_color": "#000000", // 상단 툴바 색상
  "background_color": "#ffffff", // 스플래시 화면 배경 색상
  "orientation": '' // 특정 방향(landscape, portrait)을 강제로 지정
}

 

 

 

src

• react-app-env.d.t: 타입스크립트 환경에서는 타입 지정을 하지않으면 오류가 발생한다. 변수의 타입을 지정해주기 위한 파일이다.
• reportWebVitals.ts:  React 프로젝트의 성능을 측정하기 위한 파일
• setupTests.ts: React 프로젝트에서 테스트를 실행하기 위한 설정 파일

 

 

root

• package-lock.json: 이 파일이 생성되는 시점의 의존성 트리에 대한 정보를 가지고 있는 파일이다. package.json에서는 패키지의 버전을 범위로 나타내는데 업데이트된 패키지에서 에러가 발생하는 경우가 있어 안정성을 위해 필요한 파일이다.