Question

我正在使用Webpack构建我的Angular项目。

我有一个env.js文件，如下所示：

module.exports.ENV = {
  API_URL: "http://localhost:5001/",
  ...
};

在我的webpack.common.js中，我有：

const API_URL = require('./env').ENV.API_URL;
const METADATA = {
  API_URL: API_URL,
  title: "Angular Project",
  ...
};

这很好，因为我能够在单个env.js文件中配置我的环境变量。但是，此配置在构建过程中。这很糟糕，因为我不能只构建一次并在每个环境中运行（假设环境有env.js），相反，对于每个环境，我必须构建一个项目的新实例 - 我不会这样做。认为是最好的做法。

所以我的问题是：有没有办法可以在运行时使用Angular 2和Webpack配置我的环境变量？

Answer 1

Webpack建议使用process.env.NODE_ENV：

我在很多地方都使用过这个：

const ENV = process.env.ENV = process.env.NODE_ENV = 'development';

还有另一个库包cross-env，您可以在命令行上调用它来设置环境变量，并同时执行一个进程。

您还可以从webpack插件定义环境变量（通过DefinePlugin）：

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