React:使用环境变量

Question

如何使用.bash_profileReact应用程序中定义的环境变量？我在生产中有两个React应用程序(它们是相同的项目,因此它们具有相同的代码),但是它们需要请求不同的API主机,并且我认为env变量可以做到这一点.

Answer 1

使用webpack.DefinePlugin.假设您导出FOO并BAR在您的.bash_profile,然后您的webpackconfig应如下所示:

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

您将能够在编译时通过process.env.FOO&访问js中的那些process.env.BAR

资源:https://github.com/topheman/webpack-babel-starter