Accessing env variables inside webpack AngularJS project

Question

I have an AngularJS project that uses webpack for bundling, serving, and building - no task runner such as bower or gulp is used. I'd like to be able to set environment variables for things such as the REST API endpoints that I'll be consuming in local versus production, and then access those within my actual AngularJS project files, particularly inside controllers. What's the best way to define and pass these env variables into the project?

Answer 1

The solution was to use Webpack's definePlugin to define free/global variables:

webpack.github.io/docs/list-of-plugins.html#defineplugin

new webpack.DefinePlugin({
    VERSION: JSON.stringify("5fa3b9"),
    BROWSER_SUPPORTS_HTML5: true,
    TWO: "1+1",
    "typeof window": JSON.stringify("object")
})