Bolehkah isu laluan import modul diselesaikan semasa penyusunan Webpack?

Question

Saya ingin mencipta binaan yang hanya menyertakan komponen tertentu dalam himpunan berdasarkan pembolehubah persekitaran.

Sebagai contoh, apabila saya mengimport komponen seperti ini:

import Modul1 daripada '@/components/Module1'

Saya mahu laluan itu benar-benar diubah supaya import kelihatan seperti ini:

import Modul1 daripada '@/components/brands/' + process.env.APP_BRAND + 'Module1'

Sekarang, saya tidak mahu melakukan ini untuk semua import, tetapi hanya untuk import tertentu (cth. modul dengan versi berjenama), jadi mungkin saya ingin menambah laluan import dengan sesuatu seperti < kod>!jenama! , yang akan menjadi penunjuk untuk menggunakan transformasi laluan. Oleh itu, logik di atas hanya boleh dilaksanakan untuk laluan import berikut:

import Modul1 daripada '!brand!@/components/Module1'

Jika process.env.APP_BRAND adalah palsu, maka saya hanya mahu mengekalkan import asal (cth. alih keluar awalan !brand! daripada laluan).

Jadi perkara penting ialah saya mahu ini dilakukan pada masa binaan supaya Webpack boleh menganalisis modul secara statik dan mencipta binaan yang dioptimumkan. Adakah ini boleh dilaksanakan? Saya rasa saya perlu menambah logik penukaran laluan ini entah bagaimana, tetapi bagaimana saya harus melakukannya? Patutkah saya membuat pemuat, pemalam atau adakah penyelesaian sedia dibuat?

Saya menggunakan Webpack 5.

Answer 1

Webpack menyediakan fungsi resolve modul yang boleh anda gunakan di sini. Baca dokumentasi di sini. Sebagai contoh, dalam kes anda, anda boleh melakukan ini:

const path = require('path');

module.exports = {
  resolve: {
    alias: {
      '@/components/Module1': path.join(
        __dirname,
        process.env.APP_BRAND
          ? '@/components/brands/' + process.env.APP_BRAND + 'Module1'
          : '@/components/Module1')
    }
  },
};

Sila ambil perhatian bahawa di sini anda perlu menghantar pembolehubah persekitaran kepada proses Webpack anda (aka proses Node.js) dan membuat keputusan berdasarkan ini. Selain itu, modul azam anda mestilah laluan mutlak.