react 中 process.env.REACT_APP_URL_API 未定义

Question

按照如下步骤配置dotenv-cli使用多环境，为何process.env.REACT_APP_URL_API显示未定义？

安装dotenv-cli：npm i dotenv-cli --save-dev

在根目录下添加.env.dev文件
REACT_APP_URL_API=http://dev.com
REACT_APP_URL_UPLOAD=http://upload.dev.com

在根目录下添加.env.sit文件
REACT_APP_URL_API=http://sit.com
REACT_APP_URL_UPLOAD=http://upload.sit.com

在根目录下添加.env.prod文件
REACT_APP_URL_API=http://prod.com
REACT_APP_URL_UPLOAD=http://upload.prod.com

修改package.json文件
{
  // ...
  "scripts": {
    "start": "dotenv -e .env.dev react-app-rewired start",
    "build:sit": "dotenv -e .env.sit react-app-rewired build",
    "build:prod": "dotenv -e .env.prod react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-scripts eject"
  },
  // ...
}

在index.html中使用%REACT_APP_URL_API%
在js/jsx中：process.env.REACT_APP_URL_API

Answer 1

竟然把 .env.dev文件一不小心创建在了src目录，没生效

Answer 2

可以尝试以下方案：

1. 修改环境变量重启服务
2. .env.dev命名为.env.development