Rumah >hujung hadapan web >tutorial js >Bagaimana untuk Menentukan Pembolehubah Global dalam Konfigurasi Pek Web Anda?

Bagaimana untuk Menentukan Pembolehubah Global dalam Konfigurasi Pek Web Anda?

Patricia Arquette
Patricia Arquetteasal
2024-11-09 07:38:02437semak imbas

How to Define Global Variables in Your Webpack Configuration?

Mentakrifkan Pembolehubah Global dengan Pek Web

Dalam konfigurasi pek web anda, anda boleh menggunakan pelbagai kaedah untuk mentakrifkan pembolehubah global.

1. Modul

Buat modul dan eksport objek yang mengandungi pembolehubah global anda. Import modul ini dan akses pembolehubah.

// config.js
export default {
  FOO: 'bar',
};

// somefile.js
import CONFIG from './config.js';
console.log(`FOO: ${CONFIG.FOO}`);

2. ProvidePlugin

Gunakan ProvidePlugin untuk menyediakan modul sebagai pembolehubah global. Pemalam ini hanya memasukkan modul dalam modul yang anda gunakan.

// webpack.config.js
const webpack = require('webpack');
const path = require('path');

module.exports = {
  plugins: [
    new webpack.ProvidePlugin({
      utils: 'utils',
    }),
  ],
};

3. DefinePlugin

Gunakan DefinePlugin untuk mentakrifkan pemalar global sebagai rentetan JSON.

// webpack.config.js
const webpack = require('webpack');

module.exports = {
  plugins: [
    new webpack.DefinePlugin({
      PRODUCTION: JSON.stringify(true),
      VERSION: JSON.stringify('5fa3b9'),
    }),
  ],
};

4. Objek Global

Akses objek global (tetingkap dalam penyemak imbas, global dalam Node) untuk mentakrifkan pembolehubah global.

// SPA or browser environment
window.foo = 'bar';

// Webpack will convert global to window
global.foo = 'bar';

5. Dotenv (Sisi Pelayan)

Gunakan pakej dotenv untuk memuatkan pembolehubah persekitaran daripada fail .env ke dalam process.env. Node

// server.js
require('dotenv').config();

const db = require('db');
db.connect({
  host: process.env.DB_HOST,
  username: process.env.DB_USER,
  password: process.env.DB_PASS,
});

Atas ialah kandungan terperinci Bagaimana untuk Menentukan Pembolehubah Global dalam Konfigurasi Pek Web Anda?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn