为 dev 和 local 设置 React 环境变量

Setting up React environment variables for dev and local

我不熟悉为我的项目做出反应和设置环境变量。这是我所做的..

  1. 添加.env-cmdrc.json如下

    {
     "development":{
     "REACT_APP_BASE_URL": "https://servername:port/"
     },
     "staging":{
     "REACT_APP_BASE_URL": "http://servername:port/"
     },
      "local":{
      "REACT_APP_BASE_URL": "http://localhost:port/"
      }
     }
    
  2. 已安装 npm

npm install env-cmd or npm install -g env-cmd

  1. 编辑package.json如下:

     "start:development": "env-cmd -e development react-scripts start",
     "start:staging": "env-cmd -e staging react-scripts start",
     "start:local": "env-cmd -e local react-scripts start",
     "build:development": "env-cmd -e development react-scripts build",
     "build:staging": "env-cmd -e staging react-scripts build",
    
  2. 尝试过 - npm 运行 start:development

    给我 env-cmd 错误

  3. 再次运行

    npm 安装 env-cmd

  4. 现在尝试 - npm 运行 start:development

Failed to find .rc file at default paths: [./.env-cmdrc,./.env-cmdrc.js,./.env-cmdrc.json] at getRCFile

我是第一次这样做,如果有任何帮助,我将不胜感激..我在这里缺少什么..

我建议使用 dotenv 包而不是 env-cmd.

  1. 安装包 - npm i dotenv
  2. 在您的根目录中创建一个环境文件 - .env
  3. 声明一个变量 - REACT_APP_URL=http://localhost/....
  4. 使用变量 - process.env.REACT_APP_URL

为了启动 React 应用程序,您需要检查 package.json 文件并确保它包含如下内容:

 "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

如果可以,您可以 运行 以下命令:npm start


现在您可以开始编码了:)

我试过你的代码,但效果很好。
检查你的代码,确保你的配置文件的位置.env-cmdrc.json,它应该放在你项目的根目录下(与package.json相同级别)