Akses skema daripada konfigurasi webpack

Question

Saya mempunyai kod berikut dalam webpack.config.js:

module.exports = {
    entri: {
        indeks: "./src/index.js",
        kandungan: "./src/content.js"
    },
    mod: "pengeluaran", // Bagaimana untuk mengakses nilai ini daripada kod React?
    devtool: 'inline-source-map',
    ...

Saya perlu menggunakan pelanggan lain untuk PayPal bergantung pada sama ada mod ialah 'pembangunan' atau 'pengeluaran' ; ID (kotak pasir atau persekitaran sebenar). Saya berharap untuk mengelakkan pertindihan. Jadi, bagaimana saya boleh mengakses nilai ini daripada kod React saya? 

Answer 1

Anda boleh mengakses mod ini dengan melanjutkan eksport modul sebagai fungsi anak panah. Ia adalah sebahagian daripada hujah kedua (args) yang boleh kita dekonstruksi.

module.exports = (env, { mode }) => {
  const isDevMode = mode === 'development';

  return {
     ...webpack配置在这里
   }
}

Anda kemudian boleh mencipta pembolehubah persekitaran klien menggunakan sesuatu seperti webpack.define, sebagai contoh:

## 在webpack配置之前

const SOME_STUFF = {
  production: "a",
  development: "b"
};

const bakeEnvironmentValues = (values, mode) => {
  return values[mode];
};


## 在plugins中

 new webpack.DefinePlugin({
     SOME_ENV: JSON.stringify(
         bakeEnvironmentValues(SOME_STUFF, mode)
  )}),

Anda kemudian boleh mengakses pembolehubah persekitaran itu dengan merujuk SOME_ENV (atau apa sahaja yang anda panggil) di mana-mana dalam JS pelanggan anda.