react 配置development uat production 环境

首先可以参考一下官方文档

添加自定义环境变量，
怎么创建环境

接下来进入正文

1，创建 .env, .env.test, .env.production文件

# 默认测试环境  .env
REACT_APP_ENV=development

# 预发布环境 .env.test
REACT_APP_ENV=prepare

# 线上环境 .env.production
REACT_APP_ENV=production

注：必须是以REACT_APP开头的变量 才可以。

2，npm install dotenv-cli --save-dev

3，package.json

  "scripts": {
    "start": "react-scripts start",
    "start:pre": "dotenv -e .env.test react-scripts start",
    "start:pro": "dotenv -e .env.production react-scripts start",
    "build": "react-scripts build",
    "build:pre": "dotenv -e .env.test react-scripts build",
    "build:pro": "dotenv -e .env.production react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },

4，使用

const mode = process.env.REACT_APP_ENV ;
console.log('mode',mode)