Einstellen der Release-Konfiguration für SPA/webpack

Question

Ich entwickle eine Single Page Application und verwende Webpack zum Bündeln der Module.

Eine meiner Quelldateien (ich verwende TypeScript) hat Einstellungen und Konfiguration in der Anwendung verwendet z.

// app-settings.ts 
export class AppSettings { 
    public static ApiUrlPrefix: string = "//localhost/myapi/"; 
} 

Was ich dann wie in meinem Code verwenden:

//some-class.ts 
import {AppSettings} from "./app-settings" 

export class SomeClass { 
    contructor() { 
     var something = AppSettings.ApiUrlPrefix; 
    } 
} 

Wenn Release-Zeit kommt, werde ich die Einstellungen wollen, die Live-Umgebung anzupassen.

Was ist ein guter Weg mit entweder Schluck, Npm oder Webpack-Konfigurationen, um die Einstellungsdatei zu aktualisieren? Ich habe das HtmlWebpackPlugin gesehen, das eine Vorlage nehmen und einige Optionen anschließen kann, also denke ich, dass ich nach etwas ähnlichem suche.

Answer 1

Sie können auch die webpack.DefinePlugin verwenden. Das Define-Plugin ermöglicht es Ihnen, "Free Global" - oder "Macro-like" -Variablen in Ihr Projekt zu übergeben, die Sie verwenden können. Um webpack.DefinePlugin einfach require()webpack in Ihr Projekt zu verwenden.

Hier ist the documentation and an example on how to use it.