使用 webpack 时如何设置环境变量？

Question

我正在使用 nvm、webpack 和 yarn 在本地运行 React 应用程序（不是 create-react-app 应用程序）。当我尝试在终端会话中使用环境变量时，节点进程不会拾取它们。 采取的步骤：

在单个终端会话中：

• export FOO=bar
• yarn start
• （在应用程序中，console.log(process.env.FOO)）
• 结果 = FOO 是 undefined

Answer 1

想通了！将此添加到 webpack 配置文件中：

    plugins: [
      new webpack.EnvironmentPlugin(['FOO']),
    ],

确保您已将 var 导出到用于运行 yarn...的同一终端中...

export FOO=bar

那么您将能够在您的应用程序中以process.env.FOO 的身份访问它

文档在这里： https://webpack.js.org/plugins/environment-plugin/