reactjs - react : Use environment variables

Question

如何在 React 应用程序中使用 .bash_profile 中定义的环境变量？我在生产中有两个 React 应用程序(它们是同一个项目，因此它们具有相同的代码)，但它们需要请求不同的 API 主机，我认为环境变量可以解决这个问题。

Answer 1

使用webpack.DefinePlugin。假设您在 .bash_profile 中导出了 FOO 和 BAR，那么您的 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 和 process.env.BAR 访问 js 中的这些内容

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