React .env 环境变量（详细使用、命名方式）创建 React 项目后，默认是没有 .env 文件的，需要手动创建

一、简介

创建 React 项目后，默认是没有 .env 文件的，需要手动创建，也可以使用 dotenv 插件。（附：环境变量 .env 官方文档）
文件名规则：
- .env：默认。
- .env.local：本地覆盖。为除测试之外的所有环境加载此文件。
- .env.development, .env.test, .env.production：特定于环境的设置。
- .env.development.local, .env.test.local, .env.production.local：本地覆盖特定于环境的设置。
不同文件名，在执行命令时的优先级，从左到右，左边优先局最高：
- $ npm start: .env.development.local > .env.local > .env.development > .env
- $ npm run build: .env.production.local > .env.local > .env.production > .env
- $ npm test: .env.test.local > .env.test > .env（注意 .env.local 不包含了）

在 package.json 平级目录下创建 .env 配置文件，文件名根据需要按上面优先级选择一个即可。
在 React 中需要使用，创建环境变量时，必须以 REACT_APP_ 为前缀（Vue 中则以 VUE_APP_ 为前缀）

例如：想写一个 BASE_URL 环境变量，应该写为 REACT_APP_BASE_URL=https://www.baidu.com，=前后空格可留可不留。
每次修改 .env 配置文件内容后，需要重新运行一遍项目，好像无法通过热更新生效。
环境变量定义好之后，在代码中通过 process.env 对象访问 .env 文件中的变量。

例如：访问上面定义的 REACT_APP_BASE_URL 环境变量，通过 process.env.REACT_APP_API_KEY 这样访问即可。

直接在 App.tsx 中输出测试一下：
```
import { useEffect } from 'react'

useEffect(() => {
  console.log(process.env.REACT_APP_BASE_URL)
}, [])
```