Persediaan yang boleh digunakan untuk monorepo pnpm dengan TypeScript, Vite & Rollup

Saya membina monorepo menggunakan ruang kerja pnpm dan saya mempunyai masalah untuk menjadikannya berfungsi. Ia menggunakan typescript, vite pada frontend, rollup pada perkhidmatan mikro backend.

Berikut adalah persediaannya:

package.json                            <== all dependencies reside here
tsconfig.json
pnpm-workspaces.yaml
- commonlib/
  package.json, tsconfig.json, rollup.config.js
  src/
    ...interfaces, types etc---
- serverlib/
  package.json, tsconfig.json, rollup.config.js
  src/
    ...modules for common server/microservice funtionality---
- weblib/
  package.json, tsconfig.json, vite.config.js
  src/
    ...react etc components & functions---
- servers/
    srv-gateway/
      package.json, tsconfig.json, rollup.config.js
      src/
        ...server code...
    ms-xxx/                             <== Multiple REST microservices
      package.json, tsconfig.json, rollup.config.js
      src/
        ...microservice code...
- webapps/
    app/
      package.json, tsconfig.json, vite.config.js
      src/
        ...main application code---
    admin/
      package.json, tsconfig.json, vite.config.js
      src/
        ...application code---
    app-2/                              <== Other webapps / micro frontends
      ...

Keperluan saya:

• Saya menyimpan semua kebergantungan pakej di package.json utama
• Saya ingin mengakses modul saya seperti @myapp/commonlib, @myapp/weblib, ...
• Saya tidak merancang untuk menerbitkan mana-mana ini ke npmjs (ia bukan generik - jadi saya tidak mahu menggunakan semver untuk pustaka tersebut)
• Saya mahu kebanyakan pergantungan versi lebih tinggi (saya mengemas kini mereka setiap hari). Saya juga mahu pelbagai jenis bagi setiap satu, cjs, es, esm dan lain-lain, ini mungkin tempat saya tersilap).

Masalah saya:

• Saya tersesat dalam definisi-definisi dalam package.json, tsconfig.json, rollup.config.json & vite.config.json - ia menjadi terlalu kompleks.
• Adakah saya perlu menyusun/menterjemah *lib & versi mereka atau hanya memasukkannya dengan cara tertentu?
• Termasuk bagaimana? Sebagai kebergantungan (@myapp/...)? Menggunakan "path" dan "references" di pelayan/webapps sebenar? Jika ya, adakah saya perlu vite/rollup *lib ini?
• Contohnya, dalam weblib, saya menyusunnya dengan mengecualikan semua pakej luaran (vite.config.ts -> rollupOptions -> external) tetapi sekarang saya tidak dapat membuat webapp berfungsi (skrin kosong).

Saya mempunyai sistem yang berfungsi sebelum ini, di mana saya mendefinisikan @myapp/uilib, @myapp/graphlib dan lain-lain serta menggunakan "path" dan "references". Tetapi apabila jumlahnya bertambah, saya ingin menggabungkannya ke dalam satu perpustakaan. Di sinilah saya mula kehilangan jejak. Saya membuat terlalu banyak perubahan untuk kembali ke keadaan git sebelumnya. Kesalahan adalah pada banyak tutorial yang bercanggah yang saya tonton & ChatGPT, dan sudah tentu terutamanya diri saya sendiri :/

Nampaknya saya melakukan semuanya dengan salah, sekarang saya ingin belajar cara yang betul.

Terima kasih terlebih dahulu atas bantuan anda.

Jawapan #1

Selepas senarai panjang ujian, perjuangan, dan penilaian prestasi, saya memutuskan pada ini:

• Mempunyai pergantungan di akar monorepo adalah idea yang buruk. Setiap kali saya mencapai peringkat penciptaan Docker, saya terpaksa memindahkan pergantungan ke pakej masing-masing. Pengurus pakej (pnpm) sudah menyimpannya di tahap tertinggi dan pautkan kepada mereka daripada pakej individu.
• Oleh kerana saya bekerja dengan mikroservis, setiap satu menjadi kecil selepas penstrukturan semula. Jadi, fasa pembungkusan menjadi tidak perlu, dan saya meninggalkan rollup di sisi pelayan dan beralih kepada esbuild. Ia menyediakan bundel esm (ES2020 buat masa ini) yang baik dan dioptimumkan serta menghormati "rujukan" dalam tsconfig.json. (tsup tidak - lagi, saya telah mencubanya dan membuangnya)
• Sebagai hasil daripada perkara sebelumnya, saya mengalihkan fail statik keluar dari penjanaan bundle (saya mempunyai fail data statik/json yang saya hidangkan dengan express-static). Saya memindahkan data tersebut ke pemasangan static.mydomain.com, jadi saya telah menyingkirkan proses salinan yang panjang semasa binaan.
• Saya mengekalkan setup vite/rollup pada aplikasi frontend React buat masa ini, ia berfungsi dengan baik - kecuali masalah dengan vite dalam mod dev yang bermula sangat perlahan.
• Dalam semua perpustakaan common, frontend, dan server, saya menggunakan semula pek esbuild (hanya ES2020).
• Saya juga memindahkan semua frontend dan server akhir ke direktori "apps", dan memindahkan perpustakaan ke direktori "libs".
• Saya terus menggunakan struktur tsconfig.json berbilang peringkat.

Ini adalah pengajaran panjang bagi saya dalam monorepo pertama saya. Saya akan cuba mengemas kini pos ini dengan struktur saya.