개발자
dist만 배포된 라이브러리 수정하기
안녕하세요. 프론트 준비하고 있는 대학생입니다. 토스에서 만든 overlay-kit 라이브러리를 수정해서 사용하고 싶은데, 어떻게 해야하는지 모르겠어서 질문드립니다. https://www.npmjs.com/package/overlay-kit 1. patch-package를 사용하려고 했는데, /dist만 배포 되어있어서 불가능합니다. 2. 해당 레포를 fork하고 코드를 수정하긴 했는데, 제 서비스에서 사용하려면 어떻게 해야하는지 모르겠네요. 수정한 레포를 설치하려고 하면 아래의 오류가 발생합니다. 3. 해당 라이브러리는 모노레포로 구성되어 있는 것 같은데, 어떤 걸 공부 해야 해당 라이브러리의 구조를 정확하게 이해할 수 있을지 궁금합니다. 긴 글 읽어주셔서 감사합니다.
1// yarn add https://github.com/e-tae-hyeon/overlay-kit.git
2error Can't add "root": invalid package version undefined.
답변 1
1. 당연합니다. npm에 배포된 것들은 dist나 out만 배포되어 있는 것이 정상입니다. 2번 과정에 도달하셨으니 굳이 설명은 패스하겠습니다. 2. 두 가지 방향이 있습니다. a) 래퍼 패키지를 만들어서 본인만의 npm 패키지를 만드는 방법 b) 수정된 소스코드를 본인 프로젝트 소스코드에 직접 포함 시키는 방법 3. 추천드리는 항목은 다음과 같습니다. yarm workspaces - https://yarnpkg.com/features/workspaces pnpm-workspaces - https://pnpm.io/ko/workspaces turborepo - https://turborepo.com/ ## 배경지식 ### workpsace의 본질 - node쪽 workpsace의 본질은 서로 다른 프로젝트 package.json을 한 데 통합시켜 관리는데 그 중심 목적이 있습니다. 여기서 관리란 패키지 의존성 추가|삭제|변경, script 실행 등을 의미합니다.
이태현
작성자
프론트엔드 개발자 • 5월 21일
친절한 답변 감사드립니다! 추천해주신 항목 참고하여, a 방향으로 해결해보도록 하겠습니다!
지금 가입하면 모든 질문의 답변을 볼 수 있어요!
현직자들의 명쾌한 답변을 얻을 수 있어요.
이미 회원이신가요?
커리어리 AI 봇
GPT가 달아주는 답변입니다.
5월 21일
소스 코드를 수정해서 사용하려면 직접 포크한 저장소에서 NPM 패키지를 만들고 그것을 사용해야 합니다. 여기에 대한 기본적인 절차는 아래와 같습니다: 1. 레파지토리를 Fork하고 clone합니다. 2. 소스 코드를 원하는 대로 수정합니다. 3. package.json의 `name` 및 `version`을 업데이트합니다 (`@yourusername/projectname` 같이). 4. `npm install` 이나 `yarn install` 명령어를 돌려 의존성들을 설치합니다. 5. 빌드 스크립트(만약 있는 경우)를 실행합니다. `npm run build` 이나 `yarn run build`. 6. 갱신된 버전의 패키지를 로컬 NPM에 publish 합니다: 6-1) npm일 경우, `npm publish --access public`. 6-2) yarn일 경우, 로그인(`yarn login`) 후에 publish(`yarn publish`). 7. 서비스에서는 새로운 패키지 이름(@yourusername/overlay-kit)으로 설치하여 사용할 수 있습니다. 오류 메시지가 나타난 이유는 포크된 저장소의 root 패키지.json에 Version 필드가 없기 때문일 것입니다. 모노레포(Monorepo)에 대해 공부하려면, "Lerna"와 "Yarn Workspaces"에 대해 알아보시면 좋습니다. 이 두 가지 도구는 모노레포를 관리하는 데 널리 사용됩니다. "Lerna"는 각각의 패키지 내에서 작업을 수행하고, "Yarn Workspaces"는 전체 프로젝트의 의존성을 관리하는 데 사용됩니다. 기억해야 할 중요한 점은 `yarn`이나 `npm`으로 패키지를 직접 설치할 때 개발 서버를 구동하는 방법, 테스트 하는 방법 등이 포함된 모든 사항들을 잘 문서화해놓고, 그것에 따라 패키지를 만드는 것입니다.
지금 가입하면 모든 질문의 답변을 볼 수 있어요!