평탄한 node_modules가 유일한 방법은 아닙니다.

2020년 5월 27일 · 1분 소요

pnpm의 신규 사용자들이 pnpm에서 생성하는 node_modules의 특이한 구조에 대해 자주 질문합니다. 왜 플랫이 아닌가요? 모든 하위 의존성들은 어디에 있나요?

저는 이 기사의 독자들이 npm과 Yarn에서 생성하는 node_modules에 이미 익숙하다고 가정합니다. 만약 npm 3이 플랫 node_modules 를 사용하여 v3 에서 시작해야 하는 이유를 이해하지 못하는 경우, 에서 몇 가지 사전 히스토리를 찾을 수 있습니다..

그러면 왜 pnpm의 node_modules 디렉토리는 특이할까요? 두 개의 디렉토리를 만들고 그 중 하나에서 npm add express 을 실행하고 다른 하나에서 pnpm add express을 실행합니다. 다음은 첫 번째 디렉토리의 node_modules에서 얻을 수 있는 상위 항목입니다.

.bin
accepts
array-flatten
body-parser
bytes
content-disposition
cookie-signature
cookie
debug
depd
destroy
ee-first
encodeurl
escape-html
etag
express

여러분은 여기에서 전체 디렉토리를 볼 수 있습니다.

그리고 이것이 pnpm에 의해 만들어진 node_modules에서 얻은 항목입니다.

.pnpm
.modules.yaml
express

여러분은 여기에서 전체 디렉토리를 확인할 수 있습니다.

그래서 모든 의존성들은 어디에 있을까요? node_modules 에는 .pnpm 이라는 하나의 폴더뿐이며 express라는 심볼릭 링크만 있습니다. 음, 우리는 오직 express만 설치했으므로 당신의 애플리케이션이 접근할 수 있는 유일한 패키지입니다.

왜 pnpm의 엄격함이 좋은지 여기서 자세히 읽어보세요.

express안에 무엇이 있는지 봅시다.

▾ node_modules
  ▸ .pnpm
  ▾ express
    ▸ lib
      History.md
      index.js
      LICENSE
      package.json
      Readme.md
  .modules.yaml

express 에는 node_modules가 없네요? express의 모든 의존성들은 어디에 있을까요?

트릭은 express가 단지 심볼릭 링크라는 것입니다. Node.js는 의존성을 해결할 때, 실제 위치를 사용하므로 심볼릭 링크를 유지하지 않습니다. 하지만 express의 실제 위치가 어디냐고 당신은 물어볼 수 있겠죠?

여기: node_modules/.pnpm/express@4.17.1/node_modules/express.

자, 이제 우리는 .pnpm/ 폴더의 목적을 알고 있습니다. .pnpm/ 는 모든 패키지를 플랫 폴더 구조로 저장하므로 모든 패키지는 다음 패턴으로 이름이 지정된 폴더에서 찾을 수 있습니다.

.pnpm/<이름>@<버전>/node_modules/<이름>

우리는 이것을 가상 저장소 디렉토리라고 부릅니다.

이러한 평탄한 구조는 npm v2에 의해 만들어진 중첩 형식의 node_modules 에서의 긴 경로 문제를 회피하지만, npm v3,4,5,6 또는 Yarn v1에 의해 생성된 평탄한 node _modules와는 달리 패키지를 격리된 상태로 유지합니다.

이제 express의 실제 위치를 알아보겠습니다.

  ▾ express
    ▸ lib
      History.md
      index.js
      LICENSE
      package.json
      Readme.md

사기일까요? node _modules가 여전히 없네요! pnpm에서 node_modules 구조의 두 번째 트릭은 패키지의 의존성들이 의존 패키지의 실제 위치와 동일한 디렉토리 레벨에 있다는 것입니다. 따라서 express의 의존성들은 .pnpm/express@4.17.1/node_modules/express/node_modules/에 있는 것이 아니라 .pnpm/express@4.17.1/node_modules/에 있습니다:

▾ node_modules
  ▾ .pnpm
    ▸ accepts@1.3.5
    ▸ array-flatten@1.1.1
    ...
    ▾ express@4.16.3
      ▾ node_modules
        ▸ accepts
        ▸ array-flatten
        ▸ body-parser
        ▸ content-disposition
        ...
        ▸ etag
        ▾ express
          ▸ lib
            History.md
            index.js
            LICENSE
            package.json
            Readme.md

express의 모든 의존성들은 node_modules/.pnpm/ 내의 적절한 디렉토리에 대한 심볼릭 링크입니다. express의 의존성들을 한 단계 위로 배치하면 순환 심볼릭 링크를 피할 수 있습니다.

보시다시피 pnpm의 node_modules 구조가 처음에는 특이한 것 같죠:

Node.js와 완전히 호환됩니다.
패키지는 의존성과 함께 멋지게 그룹화됩니다.

피어 의존성을 가진 패키지의 경우 구조가 조금 더 복잡하지만 생각은 동일합니다: 평탄한 디렉토리 구조로 중첩구조를 만들기 위해 심볼릭 링크를 사용하기