Terjemahkan pakej tertentu dalam node_modules kepada es5

Question

Saya sedang membuat projek Angular 12 (IE serasi) dengan beberapa kebergantungan saya dalam node_modules bukan es5.

Pada pemahaman saya, tsc tidak akan melakukan sebarang pemprosesan pada node_modules, tetapi hanya akan mendapatkan main daripada angular.json Pilihan memulakan penilaian.

Semasa mencari pilihan tentang cara melakukan ini, saya melihat banyak cadangan untuk menggunakan babel, tetapi saya tidak pasti

1. Patutkah saya mencampurkan babel dengan tsc. Atau adakah saya menghapuskan tsc dan hanya menggunakan babel melalui custom-webpack?

2. Setakat yang saya faham, dalam semua transpilasi, kod transpil masuk ke dalam direktori output, tetapi memandangkan saya perlu mentranspile fail js dalam node_modules, output fail ini hendaklah menggantikannya dalam Original fail dalam node_modules? Bagaimana kita mencapai ini?

Answer 1

Anda boleh menambah penggantian khusus dalam include dalam tsconfig.

"include": [
  "src/**/*",
  "node_modules/foo/index.ts",
  "node_modules/bar/quux.baz.mjs"
]

Tetapi apabila anda membungkus untuk pelanggan, anda biasanya tidak memasukkan kebergantungan sebagai skrip berasingan, tetapi biarkan alat pembungkusan memutuskan di mana untuk meletakkannya. Anda tidak menyebut alat pembungkusan yang sedang anda gunakan, tetapi jika anda telah allowJS: true menyediakan, anda tidak memerlukan Babel - contohnya, perubahan yang berkaitan pada konfigurasi Webpack anda ialah:

{
  test: /\.(js|ts)$/,
  exclude: /node_modules\/(?!(foo|bar)\/).*/, // 这一行

Walau bagaimanapun, jika anda mahukan autoisi, menggunakan @babel/preset-envdengan rentetan Senarai Pelayar mungkin pilihan terbaik.