javascript - 如何为多个环境设置环境变量？

我有一个Next.js应用程序，目前在本地工作时已具有此next.config.js设置来访问我的.env文件，效果很好：

// Initialize doteenv library
require("dotenv").config();

module.exports = {
  webpack: config => {
    // Fixes npm packages that depend on `fs` module
    config.node = {
      fs: "empty"
    };
    /**
     * Returns environment variables as an object
     */
    const env = Object.keys(process.env).reduce((acc, curr) => {
      acc[`process.env.${curr}`] = JSON.stringify(process.env[curr]);
      return acc;
    }, {});

    /** Allows you to create global constants which can be configured
     * at compile time, which in our case is our environment variables
     */
    config.plugins.push(new webpack.DefinePlugin(env));
    return config;
  }
};

但是，当应用程序基于实时（platform.sh）环境构建时，我需要访问platform.sh变量而不是我的.env变量。 Platform.sh提供以下代码片段作为示例：

function read_base64_json(varName) {
  try {
    return JSON.parse(new Buffer(process.env[varName], 'base64').toString());
  } catch (err) {
    throw new Error(`no ${varName} environment variable`);
  }
};

// A simple variable.
let projectId = process.env.PLATFORM_PROJECT;

// A JSON-encoded value.
let variables = read_base64_json('PLATFORM_VARIABLES');

但是我不确定在哪里使用它以及它如何工作，以便它在本地使用我的.env文件，并在实际环境中使用platform.sh变量。做这个的最好方式是什么？

最佳答案

在您的webpack.config中，您可以像这样重新配置插件部分

plugins: [
    new webpack.DefinePlugin({
      VARIABLE_NAME:
        process.env.NODE_ENV === "production"
          ? VARIABLE_PRODUCTION_VALUE
          : VARIABLE_LOCAL_VALUE
    })
  ]

您可以在应用程序中的任何位置使用VARIABLE_NAME，它会根据环境而变化。