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以外は変更がありません）、不必要な混乱が生じる可能性があります。 。 テストの実行後にビルドを削除することもできますが、本番環境にデプロイする前にシステムテストを実行し、同じコンパイル済みコードを再利用するフローが中断されます。

@jaredpalmerは、本番ビルドでPORTをインライン化する決定を再検討し、const PORT = process.env.PORTなど）を追加してください。 その可能性がない場合は、この問題を閉じてください。ツールに免責事項を追加します:)

@ d4rky-plこれを正しくしましょう。

ブラックリストに登録した場合はどうなりますか

• process.env.RAZZLE_SERVER_はコンパイルされません
• およびPORT

おそらくあなたはこれを知っていると思いますが、実行時にprocess.env.から読み取るのは非常に遅く、可能な限り避けるべきものです。 ただし、razzleをherokuなどに簡単に展開できるとよいでしょう。 これを理解しましょう。

私はこれが好き。 PORT 、パフォーマンスは問題にならないはずです。このenv変数は、起動時にのみ読み取られます。

RAZZLE_SERVER_に関しては、名前はわかりませんが、これらのいくつかの追加のケースの良い回避策のように聞こえます-これがすべてを設定する方法であると人々が考えると、混乱してパフォーマンスが低下する可能性がありますサーバー側の環境変数（アプリケーションの起動時に実際にオーバーライドする変数だけでなく）。 でも、これ以上の選択肢はないのではないかと思います。

同じ問題が発生しました。ビルド時に定義されていないenv変数でも発生します。 これは回避策です：

/* 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ボットは、最近のアクティビティがしばらくないため、これを古いものとしてマークします。 数日以内にそれ以上の活動が発生しなければ、閉鎖されます。 これを個人的に（真剣に）行わないでください。これは完全に自動化されたアクションです。 これが間違いである場合は、コメントを入力するか、DMを送信するか、キャリアピジョンを送信するか、発煙信号を送信してください。

非アクティブのため、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'));

同じ問題が発生しました。ビルド時に定義されていないenv変数でも発生します。 これは回避策です：

/* 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)
  );

`