patch-package, npm 패키지 커스텀하기

 

0. 서론

프로젝트 받고 가장 먼저 npm install, yarn 등을 통해 필요한 패키지들을 node_modules파일에 모은다.

보통 문제없이 잘 작동하기 때문에 node_modules파일 안에 있는 내용은 수정할 일이 별로 없다.

 

근데 만약에 node_modules 내부 코드에 문제가 있으면 어떻게 해야할까?

내가 사용하는 특정 버전에서 다른 모듈과의 호환성 문제가 되거나 하는 상황이 펼쳐진다면 어떻게 해야할까?

버전 사용 이전에 그러한 부분들을 미리 체크하고, 필요하다면 버전을 업그레이드 하는게 제일 최선의 방법일 것이다. 하지만 모든 상황에서 버전 업그레이드가 쉽지는 않다. 내가 접한 것은 react-native와 Xcode 버전간의 문제였다.

 

react-native의 버전을 최신으로 올려서 문제를 해결해라고들 하지만, 그러기에 react-native 버전이 기존에 너무 낮았기에, 이를 최신버전으로 업그레이드 하는건 배보다 배꼽이 더 커지는? 일이 되어버리는 것이다. 그러다가 찾은 하나의 빛이, node_modules에 있는 react-native에서 특정 파일을 수정하라는 해결책이었다. 특정파일을 수정하고나니 정상적인 빌드가 가능했다.

그런데.. 이를 git에 어찌 반영해야하는가..? node_modules을 앞으로 계속 다 올려...야 하나?? (말도안되는) 이럴때 우리에게 한줄기 빛이 되어주는 것이 바로 patch-package되시겠다.

 

patch-package는 node_modules 속 커스텀한 상황을 배포상태에서 반영할 수 있게 해준다. 

 

1. 설치

//package.json

"script" : {
	"postinstall": "patch-package"
},

 

위에 라인을 추가해주고 $ yarn i patch-package 를 통해서 다운로드 해준다. 그럼 사용할 세팅 준비는 끝이난다.

 

2. 사용

이제 node_modules  내에서 수정하고 싶은 파일을 수정해준다.

나의 경우 node_modules에 있는 react-native 폴더 안에 있는 특정 코드를 수정했다.

그리고 나서 아래 명령어를 추가해준다. 

 

$ yarn patch-package react-native(내가 수정한 라이브러리 이름) 

 

 

그러고 나면 루트 폴더에 patches라는 폴더가 새로 생기고 해당 폴더 안에 수정한 패키지에 대한 정보가 들어간다!!

이제 yarn 인스톨 시점에 자동으로 node_modules를 덮어쓰게 된다!! 이제 이 폴더를 git에 올려주면 모두가 같은 수정사항을 공유할 수 있게 된다. 올리기 전에 node_modules를 지우고 yarn혹은 npm install을 통해 반영이 잘되는지 한번 더 체크해주는 센스!

 

 

 

 

4. 결론

패키지 의존 문제가 생기면 해결되기까지 기다리거나 버전 자체를 바꾸는 등의 방법 외에도, 

의존성을 유지하면서 이렇게 직접 수정해서 사용할 수 있다. 좀 더 손쉽게 문제를 타파하는 대안이 될 수 있지 않나 싶다!

 

---

 

역시 Xcode랑 react-native는 친해지기 어렵다!