这取决于您的操作系统和shell

在linux上使用shell bash，你可以在控制台中创建这样的环境变量:

export FOO=bar

有关ubuntu环境变量的更多信息(例如):

ubuntu上的环境变量

我强烈建议你查查dotenv包。

https://github.com/motdotla/dotenv

它有点类似于@Benxamin回答中建议的库，但它要干净得多，并且不需要任何bash脚本。同样值得注意的是，代码库很受欢迎，维护得很好。

基本上你需要一个.env文件(我强烈建议忽略你的git/mercurial/etc):

FOO=bar
BAZ=bob

然后在你的申请入口文件中尽早输入以下一行:

require('dotenv').config();

繁荣。完成了。的过程。Env '现在将包含上面的变量:

console.log(process.env.FOO);
// bar

”。Env文件不是必需的，所以你不需要担心你的应用程序在它缺席时崩溃。

对于windows用户来说，这个Stack Overflow问题和顶部答案对于如何通过命令行设置环境变量非常有用

如何在Windows中设置NODE_ENV=production ?

步骤1:将环境变量添加到相应的文件中。例如，您的登台环境可以称为.env。其中包含特定于登台环境的环境变量USER_ID和USER_KEY。

第二步:包装。Json文件，添加以下内容:

"scripts": {
  "build": "sh -ac '. ./.env.${REACT_APP_ENV}; react-scripts build'",
  "build:staging": "REACT_APP_ENV=staging npm run build",
  "build:production": "REACT_APP_ENV=production npm run build",
  ...
}

然后在部署脚本中像这样调用它:

npm run build:staging

超级简单的设置和工作就像一个魅力!

来源:https://medium.com/@tacomanator environments-with-create-react-app-7b645312c09d

我在设置系统环境变量后得到了未定义。当我把APP_VERSION放在用户环境变量中，然后我可以通过process.env.APP_VERSION显示节点的值

使用dotenv-webpack让您的生活更轻松。简单地安装它npm install dotenv-webpack——save-dev，然后在你的应用程序的根目录下创建一个。env文件(记得在你推送git之前把它添加到。gitignore中)。打开这个文件，设置一些环境变量，例如:

ENV_VAR_1=1234
ENV_VAR_2=abcd
ENV_VAR_3=1234abcd

现在，在你的webpack配置中添加:

const Dotenv = require('dotenv-webpack');
const webpackConfig = {
  node: { global: true, fs: 'empty' }, // Fix: "Uncaught ReferenceError: global is not defined", and "Can't resolve 'fs'".
  output: {
    libraryTarget: 'umd' // Fix: "Uncaught ReferenceError: exports is not defined".
  },
  plugins: [new Dotenv()]
};
module.exports = webpackConfig; // Export all custom Webpack configs.

只有const Dotenv = require(' Dotenv -webpack');，插件:[new Dotenv()]，当然还有模块。出口= webpackConfig;//导出所有Webpack配置。是必需的。然而，在某些情况下，您可能会得到一些错误。对于这些问题，你也有解决方案，这意味着你可以修复某些错误。

现在，你可以在任何地方使用process.env。ENV_VAR_1 process.env。ENV_VAR_2 process.env。应用程序中的ENV_VAR_3。