내가 프로젝트나 과제를 할 때마다 create-react-app으로 react를 켤 때마다,
항상 보이는 파일이 있다.
바로 package.json과 package-lock.json!
보면서 드는 생각은 이거였다.
package.json은 깔려있는 모듈과 버전을 알려주는 파일인데,
package.json은 변경할 수 있는 파일이고,
package-lock.json은 변경하지 못하게 막아놓은 파일인걸까...?
(완전 주관적인 저의 생각입니다.🧨 이거 정답이 아니에요!)
그래서 오늘은 두 파일의 차이점을 적어보려고 합니다!🐹
package-lock.json이 만들어지는 이유는?
간단하게 말하면 package.json에서의 버전은 version range라는것을 사용하는데,
이 version range는 틸드(~)로 버전을 명시합니다.
예를 들어보면
ex) "mango"(가상의 모듈) : "~3.7.2"
😫나는 정확히 모듈의 3.7.2버전을 사용할거야!!!!❌❌❌
😏나는 3.7.2버전 이상, 3.8버전 미만의 패키지를 사용할게⭕⭕⭕
굳이 version range를 쓰지 않고도 정확한 버전을 명시하는 것도 가능합니다.
그런데 이렇게 package.json에 정확한 버전을 명시하고나서 협업을 하다보면 모듈이 맞지 않아서 서로의 컴퓨터에서 코드가 돌아가지 않는 등의 상황도 충분히 발생할 수 있기 때문에, 우리는 이러한 상황들을 예방할 필요가 있습니다😲
그래서 나온 것이 바로...!!!!!!!!!
이 package-lock.json입니다.
package.json에서 틸드로 명시되어 있는 모듈의 버전들을,
package-lock.json에서는 버전명이 정확하게 명시되어 있는것을 확인할 수 있는데요.
package-lock.json들은 정확히 언제! 생성되는 걸까요?
1. package.json이 수정될 때
2. node-module이 수정될 때
3. npm i로 모듈을 install 했을때
라고 합니다.
과제를 하는 도중 storybook을 react에서 실행시키려고 할 때마다
broken이 일어나서 서버가 켜지지 않는 상황이 발생했었는데,
package-lock.json 파일을 지우고,
3번째 방법인 npm i로 모듈을 다시 설치했을때 정상작동이 되는 걸 확인할 수 있었습니다.
