개발 기본
package.json
package.json은 자바스크립트 프로젝트에 필요한 패키지와 `개발 서버 실행`, `빌드` 같은 명령을 정리한 중심 설정 파일입니다.
쉬운 설명
package.json은 자바스크립트 프로젝트에 필요한 패키지와 `개발 서버 실행`, `빌드` 같은 명령을 정리한 중심 설정 파일입니다.
배경과 쓰임까지 이해하기
조금 더 자세히
package.json은 자바스크립트 프로젝트에 무엇이 필요하고 어떻게 실행해야 하는지 정리한 중심 설정 파일입니다. 프로젝트 이름과 버전, 설치할 패키지인 `dependencies`, `npm run dev`나 `npm run build`로 실행할 명령인 `scripts` 등이 들어갑니다. npm은 이 파일을 읽어 필요한 패키지를 설치하고 정해진 명령을 실행합니다.
새 프로젝트를 받았을 때 package.json을 보면 어떤 도구를 쓰는지, 개발 서버와 빌드는 어떻게 실행하는지 빠르게 파악할 수 있습니다. package-lock.json은 별도의 파일로, 실제 설치된 패키지의 정확한 버전과 연결 관계를 기록합니다. 한마디로, package.json은 자바스크립트 프로젝트의 준비물과 실행 방법을 적어둔 관리표입니다.
실제로는 이렇게 만나요
`scripts`에 `"dev": "astro dev"`를 적으면 `npm run dev`로 개발 서버를 실행할 수 있고, `dependencies`에는 프로젝트 실행에 필요한 패키지가 기록됩니다.
- 이런 거 할 때 나와요 npm은 package.json을 읽어 패키지를 설치하고 스크립트를 실행합니다. 새 프로젝트를 받았을 때 무엇이 필요하고 어떻게 실행하는지 파악하는 출발점이 됩니다.
- 이렇게 생겼어요 중괄호 안에 `scripts`, `dependencies`, `devDependencies` 같은 항목이 적힌 JSON 파일로 보입니다.
- 나오는 화면 예시 코드 편집기의 프로젝트 최상위 폴더에서 package.json을 열어둔 화면
package.json과 package-lock.json은 같은 파일인가요?
역할이 다릅니다. package.json은 사용할 패키지의 범위와 실행 명령을 사람이 관리하는 파일이고, package-lock.json은 실제로 설치된 패키지의 정확한 버전과 연결 관계를 npm이 기록하는 파일입니다.
헷갈리기 쉬운 점
JSON 문법이 깨지거나 존재하지 않는 스크립트를 실행하면 오류가 납니다. 패키지 버전을 직접 바꾼 뒤에는 설치 결과와 lockfile도 함께 확인해야 합니다.
왜 알아두면 좋을까요?
npm은 package.json을 읽어 패키지를 설치하고 스크립트를 실행합니다. 새 프로젝트를 받았을 때 무엇이 필요하고 어떻게 실행하는지 파악하는 출발점이 됩니다.
Checklist
실제로 볼 때 확인할 것
- 01
scripts에서 사용할 수 있는 명령을 확인한다
- 02
dependencies와 devDependencies의 역할을 구분한다
- 03
package-lock.json 같은 lockfile을 함께 관리한다