Razzle: 编译后的内联 PORT 环境变量

我还注意到getClientEnvironment stringified函数的编写方式，整个process.env被替换为内联对象，包括所有环境变量：

// console.log(process.env.PORT) gets compiled to:
console.log(Object({"NODE_ENV":"production","PORT":3000,"VERBOSE":false,"HOST":"localhost","RAZZLE_ASSETS_MANIFEST":"somepath","BUILD_TARGET":"server","RAZZLE_PUBLIC_DIR":"somepath"}).PORT);

这使得在不每次都重建的情况下使服务器应用程序配置动态化是不可能的。

嗨@d4rky-pl，
您可以使用razzle-heroku :) 它扩展了默认的 razzle 配置，使其适用于 heroku。
有关更多信息，请参阅 #340

@xouabita这很好，谢谢:)

我觉得 Razzle 应该默认支持这个，或者对process.env和生产构建在更突出的地方有一个警告。

事实证明，这比我想象的更成问题。 让我解释：

我正在编写一个系统测试运行程序（系统测试：在实际浏览器中运行的测试），我想从第一天开始添加 razzle 支持。 问题是，因为 PORT 在生成的构建中内联，所以在测试之前编译所有内容时，我还必须内联它。

当有人然后尝试将相同的构建用于其他东西时（毕竟它是生产构建，除了 PORT 零变化）时，这可能会导致不必要的混淆，因为测试中的内联 PORT 与“正常”生产编译期间的内联 PORT 不同. 我也可以在运行测试后放弃构建，但它会打破我们在生产部署之前进行系统测试然后重用相同的编译代码的流程。

@jaredpalmer请重新考虑在生产构建中内联 PORT 并添加一次性查找（类似于 server.js 开头的const PORT = process.env.PORT ）的决定。 如果没有机会，请关闭此问题，我将在我的工具中添加免责声明:)

@d4rky-pl 让我们改正吧。

如果我们被列入黑名单怎么办

• process.env.RAZZLE_SERVER_不会被编译
• 和PORT

我相信您可能知道这一点，但是在运行时读取process.env.非常慢，应该尽可能避免这种情况。 但是，如果 razzle 更容易部署到 heroku 等会更好。所以是的。 让我们弄清楚这一点。

我喜欢这个。 在PORT的情况下，性能应该不是问题，这个环境变量只在启动时被读取。

至于RAZZLE_SERVER_ ，对于这几个额外的情况，听起来是一个很好的解决方法，尽管我不确定名称 - 当人们认为这是您应该如何设置所有内容时，它可能会令人困惑并导致性能下降服务器端环境变量（而不是仅在应用程序启动期间您实际想要覆盖的那些）。 恐怕我没有更好的选择了。

我有同样的问题，也发生在构建时未定义的环境变量中。 这是解决方法：

/* eslint-disable no-param-reassign */
const razzleConfigEnv = require('razzle/config/env');

module.exports = {
  modify: (config, { target, dev }, webpack) => {
    // Fix process.env
    if (target === 'node') {
      config.plugins = config.plugins.filter(plugin => plugin.constructor.name !== 'DefinePlugin');
      const dotenv = razzleConfigEnv.getClientEnv(target, {
        clearConsole: true,
        host: 'localhost',
        port: 3000
      });
      config.plugins.push(
        new webpack.DefinePlugin({
          'process.env': `Object.assign(${JSON.stringify(dotenv.raw)}, process.env)`
        })
      );
    }
    return config;
  }
};

这是我对 Heroku 的解决方法：

// getPorts.js

// bypass webpack.DefinePlugin
const { env } = require('process')

export const port = () =>
  parseInt(
    env.RAZZLE_PORT ||
      env.PORT ||
      process.env.RAZZLE_PORT ||
      process.env.PORT ||
      3000,
    10,
  )

你好！ 所以这就是开源和我的日常工作和生活之间的交易，我有很多事情要管理，所以我使用 GitHub 机器人在这里和那里自动化一些事情。 这个特定的 GitHub bot 会将其标记为过时，因为它有一段时间没有最近的活动。 如果几天内没有进一步的活动，它将被关闭。 不要把这当回事——说真的——这是一个完全自动化的动作。 如果这是一个错误，请发表评论，DM 我，发送载体 pidgeon 或烟雾信号。

由于不活动，ProBot 自动关闭了它。 如果这是一个错误，请大喊大叫，我们将重新打开它。

如果人们仍在努力解决这个问题，我找到了一个非常简单的解决方法

  // This will extract the env during production execution.. PORT will not be inlined during build
  const getEnv = c => process.env[c];
  app.listen(getEnv('PORT'));

我有同样的问题，也发生在构建时未定义的环境变量中。 这是解决方法：

/* eslint-disable no-param-reassign */
const razzleConfigEnv = require('razzle/config/env');

module.exports = {
  modify: (config, { target, dev }, webpack) => {
    // Fix process.env
    if (target === 'node') {
      config.plugins = config.plugins.filter(plugin => plugin.constructor.name !== 'DefinePlugin');
      const dotenv = razzleConfigEnv.getClientEnv(target, {
        clearConsole: true,
        host: 'localhost',
        port: 3000
      });
      config.plugins.push(
        new webpack.DefinePlugin({
          'process.env': `Object.assign(${JSON.stringify(dotenv.raw)}, process.env)`
        })
      );
    }
    return config;
  }
};

我试过了，但是当我在本地尝试 'npm run start:prod ' 时，我收到一个错误，说 assets.json 未找到。 另外，您能否建议一下，我是否需要在构建文件夹中上传 node_modules 以及我是否也收到 npm 包相关的错误。

这现在对我有用。

`
appConfig.plugins = appConfig.plugins.filter(plugin => plugin.constructor.name !== 'DefinePlugin');
const dotenv = razzleConfigEnv.getClientEnv(target);

  delete dotenv.raw.PORT;
  config.plugins.push(
    new webpack.EnvironmentPlugin(dotenv.raw)
  );

`