2016-06-22 11 views
12

Reactアプリケーションで.bash_profileに定義されている環境変数を使用するにはどうすればよいですか?私は2つのReactアプリケーションを生産しています(彼らは同じプロジェクトなので、同じコードを持っています)が、別々のAPIホストにリクエストする必要があり、env変数がこのトリックを行うことができると思いました。React:環境変数を使用

+2

あなたは_anything_を試しましたか? –

+1

何らかの種類のモジュールバンドラを使用していますか?ウェブパック?ブラウジング? – topheman

+0

あなたはあなたが使っていることを述べていませんが、通常、これはサーバー側で行われます。私はJSが環境変数を読むことができないと考えています。ノードでは 'process.env.API_HOST'を実行することができます – eblin

答えて

21

webpack.DefinePluginを使用してください。 https://github.com/topheman/webpack-babel-starter

const config = { 
    entry: 'somescript', 
    // ... 
    module: { 
    // ... 
    }, 
    // ... 
    plugins: [ 
    // ... your plugins 
    new webpack.DefinePlugin({ 
     'process.env':{ 
     'FOO': process.env.FOO, 
     'BAR': process.env.BAR 
     } 
    }) 
    ], 
    // ... 
} 

あなたはprocess.env.FOO & process.env.BAR

リソースを経由して、コンパイル時にあなたのjsのそれらにアクセスすることができるようになります。そして、あなたのwebpackconfigがどのように見えるはずです、あなたは.bash_profileFOOBARを輸出言います

+0

あなたが言ったように、ビルド時にのみ動作します。 @ sauronnikkoは、彼は同じコードを持つ2つのプロジェクトを持っていると言いました。あなたの解決策によれば、彼は2つの異なるアプリケーション、すなわち異なるコードを持つでしょう。 –

+0

ちょうどチケットにコメントを読んで、それは彼らが必要とするように思えます。ごめんね。 –

+0

@MikhailChibelはい、申し訳ありませんが、質問は明確ではありませんでした。ビルド時に変数を使用したい – sauronnikko