Wie übergebe ich umgebungsabhängige Variablen in Angular Webpack Apps?

Übergabe umgebungsabhängiger Variablen in Webpack

Die Konvertierung einer Angular-App von Gulp in Webpack stellt die Herausforderung dar, HTML-Seitenvariablen basierend auf NODE_ENV zu ersetzen . Hier sind mehrere effektive Methoden, um dies mit Webpack zu erreichen:

1. DefinePlugin

Dieses Plugin ermöglicht das Ersetzen übereinstimmender Variablen durch die bereitgestellte Zeichenfolge:

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

2. EnvironmentPlugin

Dieses Plugin nutzt intern DefinePlugin und ordnet Umgebungswerte dem Code zu:

new webpack.EnvironmentPlugin(['NODE_ENV'])

3. Alias

Durch die Erstellung eines Alias-Moduls können Sie über Verbrauchermodule auf die Konfiguration zugreifen:

// Consumer side
var config = require('config');

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

Je nach NODE_ENV wird dies einem Modul zugeordnet, das die Konfiguration exportiert, was Ihnen ermöglicht um auf umgebungsabhängige Variablen in Ihrer Anwendung zuzugreifen.

Das obige ist der detaillierte Inhalt vonWie übergebe ich umgebungsabhängige Variablen in Angular Webpack Apps?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!