如何在Webpack中傳遞環境相關變數？

在 Webpack 中傳遞環境相關變數

將 Angular 應用從 Gulp 遷移到 Webpack 時，一項常見任務是管理環境相關變數。以下是使用Webpack 實現此目的的三種有效方法：

1. DefinePlugin

此方法使用DefinePlugin 直接取代HTML 頁面中的變數：

new webpack.DefinePlugin({
    'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development')
})

注意，字串格式保留變數的環境值。

2. EnvironmentPlugin

EnvironmentPlugin 透過將環境值對應到內部程式碼來簡化DefinePlugin 流程：

new webpack.EnvironmentPlugin(['NODE_ENV'])

3.別名

消費端：

var config = require('config');

配置模塊：

這允許您根據環境變數從指定模組導出配置。

resolve: {
    alias: {
        config: path.join(__dirname, 'config', process.env.NODE_ENV)
    }
}

以上是如何在Webpack中傳遞環境相關變數？的詳細內容。更多資訊請關注PHP中文網其他相關文章！