Webpack中的可互換配置文件

Question

我正在嘗試捆綁一個可以在多個環境中運行並需要不同配置才能在每個環境中運行的反應項目。我建立了與browserify，但最近一直在尋找移動到webpack。

這個想法是這樣的：有一個js目錄有一堆js文件，其中main.js是入口點。還有一個config文件夾，其中development.js,staging.js,production.js等。我正在使用import config from './config'從所有文件導入配置。所以我希望能夠用我們所有的代碼創建一個main.bundle.js文件，而另一個config.js的內容可以用{environment}.js的文件替換。

這使我們能夠在部署時間中選擇應用程序的配置，而不是在構建時，只需複製{environment.js}的內容即可。

我試圖使用webpack的CommonsChunkPlugin失敗，但它在捆綁時抱怨js/config.js不在（顯然）。

Answer 1

爲什麼不製作多個版本，每個配置一個，然後部署一個你想要的？有不同的方法可以爲構建加載所需的配置，但一種方法是使用DefinePlugin爲每個環境定義常量，爲這些常量編寫條件以加載相應的配置，並讓Uglify插件的死代碼消除削減有條件的一個有效的情況。我已經在很多地方使用這種方法來處理每個環境的條件而不會使生產代碼膨脹。