自定义项目环境变量
https://blog.csdn.net/qq_44776454/article/details/134154279
| 工具 | 典型场景 | 功能定位 |
| :———— | —————————————- | ——————————————————– |
| cross-env | 在 package.json 脚本中统一设置环境变量 | 跨平台环境变量设置工具 |
| env-cmd | 多环境配置管理（开发、测试、生产） | 环境变量文件加载工具，支持从 .env 文件批量加载变量 |
在React中，变量名必须是REACT_APP_XXX的形式，否则无效
原因：REACT_APP_ 前缀是 React 环境变量的强制命名规则，通过 create-react-app 脚手架创建的项目，只会加载以 REACT_APP_ 开头的环境变量
关闭sourceMap
在一些前端项目中，通常会使用一些构建工具（如 webpack、gulp 等）来打包和压缩代码，以减小文件体积并提高加载速度。在这个过程中，有时候也会生成一个 source map 文件，用于在开发者工具中调试代码时，将压缩后的代码映射回原始代码。但是，source map 文件也会增加文件体积，因此在某些情况下，我们可能会希望禁用 source map 的生成，以减小文件体积。
GENERATE_SOURCEMAP=false
禁用ESLint 插件
通常会使用 ESLint 工具来检查代码的规范性和错误。有时候，我们可能会遇到一些问题，例如某些 ESLint 插件与我们的代码库不兼容，或者我们不想使用某些插件。在这种情况下，我们可以通过禁用某些插件来解决问题
DISABLE_ESLINT_PLUGIN=true
开发阶段(.env.development) 忽略Eslint 错误
在进行快速开发时，往往不希望eslint的报错，阻止项目的启动，可能需要暂时忽略某些 ESLint 错误
这个设置的前提，是项目必须配置了 husky +lint-staged+ pre-commit，以确保提交前，ESLint 校验后无误
ESLINT_NO_DEV_ERRORS=true
具体设置
.env.development
ESLINT_NO_DEV_ERRORS=true //开发环境，忽略 Eslint 错误
REACT_APP_ENV=development
REACT_APP_API_URL=http://localhost:3000
.env.prod
DISABLE_ESLINT_PLUGIN=true //生产环境，关闭 ESLint，关闭 sourceMap
GENERATE_SOURCEMAP=false
REACT_APP_ENV=production
REACT_APP_API_URL=https://api.example.com
评论区