嘗試將與gulp環境相關的Web Pack變量傳遞給angularjs應用

Question

我對AngularJS和gulp和webpack還是比較陌生，所以如果我使用的術語不正確，請原諒。 已經閱讀了兩個小時的堆棧溢出和angularjs內容，無法與我正在閱讀的內容建立連接。

我要進入一個已經開發的應用程序，並嘗試找到最佳方法，以將來自webpack插件變量的Analytics API密鑰包含到AngularJS應用程序中以供使用。

目錄的設置如下：

ng_organize
    /gulp
        /tasks
            webpack-development.js
            webpack-production.js
        /util
    /src
        /appName
            /customer
                CustomerController.js
                ...
            /home
            /shop
        app.js
        index.js
    application.js

ng_organize ng_organize/gulp/tasks/webpack-development.js中的webpack變量為：

gulp.task('webpack:development', function(callback){
    webpack({
        context: ...
        plugins: [
            new webpack.DefinePlugin {
                GOOGLE_ANALYTICS_KEY: 'XXX',
                ...
            }    
        ]
    });
});

目前，可以使用GOOGLE_ANALYTICS_KEY在ng_organize/application.js訪問webpack變量。 我正在嘗試在ng_organize/src/appName/customer/CustomerController.js訪問它們。

我想創建一個服務來存儲依賴於環境的GOOGLE_ANALYTICS_KEY（和其他鍵）。 這可能嗎？ 如果是這樣，我將如何去做？

Answer 1

事實證明，它們會自動全局包含在您的應用程序代碼中，您只是無法在調試器中調用全局變量（這就是我測試如何查看它們是否可以在CustomerController中訪問的方式）。

仍可以在CustomerController中訪問GOOGLE_ANALYTICS_KEY 。