Flat node_modules bukan satu-satunya cara

Pengguna baru pnpm sering bertanya kepada saya tentang struktur aneh node_modules yang dibuat pnpm. Kenapa tidak flat? Di mana semua sub-dependensi?

Saya akan berasumsi bahwa pembaca artikel sudah terbiasa dengan flat node_modules dibuat oleh npm dan Yarn. Jika Anda tidak mengerti mengapa npm 3 harus mulai menggunakan flat node_modules di v3, Anda dapat menemukan beberapa prasejarah di Mengapa kita harus menggunakan pnpm?.

Jadi mengapa node_modules pnpm tidak biasa? Mari buat dua direktori dan jalankan npm add express di salah satunya dan pnpm add express di direktori lainnya. Inilah bagian atas dari apa yang Anda dapatkan di direktori pertama node_modules:

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

Anda dapat melihat seluruh direktori disini.

Dan inilah yang Anda dapatkan di node_modules dibuat oleh pnpm:

.pnpm
.modules.yaml
express

Anda dapat memeriksanya disini.

Jadi di mana semua dependensinya? Hanya ada satu folder di node_modules bernama .pnpm dan symlink bernama express. Nah, kami hanya menginstal express, jadi itu adalah satu-satunya paket yang dapat diakses oleh aplikasi Anda

Baca lebih lanjut tentang mengapa keketatan pnpm adalah hal yang baik disini

Mari kita lihat apa yang ada di dalam express:

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

express tidak memiliki node_modules? Di mana semua dependensi express?

Triknya adalah express hanyalah sebuah symlink. Saat Node.js menyelesaikan dependensi, ia menggunakan lokasi sebenarnya, sehingga tidak mempertahankan symlink. Tapi di mana lokasi sebenarnya dari express, Anda mungkin bertanya?

Di sini: node_modules/.pnpm/express@4.17.1/node_modules/express.

Oke, jadi sekarang kita tahu tujuan dari folder .pnpm/. .pnpm/ menyimpan semua paket dalam struktur folder datar, sehingga setiap paket dapat ditemukan dalam folder yang dinamai dengan pola ini:

.pnpm/<name>@<version>/node_modules/<name>

Kami menyebutnya direktori virtual.

Struktur datar ini menghindari masalah jalur panjang yang disebabkan oleh node_modules bersarang yang dibuat oleh npm v2 tetapi membuat paket tetap terisolasi tidak seperti node_modules datar yang dibuat oleh npm v3,4,5,6 atau Yarn v1.

Sekarang mari kita lihat lokasi sebenarnya dari express:

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

Apakah itu penipuan? Masih kekurangan node_modules! The second trick of pnpm's node_modules structure is that the dependencies of packages are on the same directory level as the real location of the dependent package. Jadi dependensi express tidak ada di .pnpm/express@4.17.1/node_modules/express/node_modules/ tetapi dalam .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

Semua dependensi express adalah symlink ke direktori yang sesuai di node_modules/.pnpm/. Menempatkan dependensi express satu tingkat ke atas memungkinkan menghindari symlink melingkar.

Jadi seperti yang Anda lihat, meskipun struktur node_modules pnpm tampak tidak biasa pada awalnya:

1. itu sepenuhnya kompatibel dengan Node.js
2. paket dikelompokkan dengan baik dengan dependensinya

Strukturnya sedikit lebih kompleks untuk paket dengan dependensi rekan tetapi idenya sama: menggunakan symlink untuk membuat sarang dengan struktur direktori datar.