1,暴露配置
npm run eject
2,安装cross-env
npm i cross-env -D
3,创建配置文件
在项目目录下分别创建
.env写入公共配置,
.env.development开发环境下配置,
.env.production生成环境下配置
文件名视情况而定,必须要以.env开头
内容写入变量,例如.env.development:
REACT_APP_NODE_ENV='development'
REACT_APP_ENV='development'
REACT_APP_BaseUrl='http://localhost:5000/api'
REACT_APP_apiUrl='http://localhost:4000'
REACT_APP_PORT=5000
4,配置package.json
"scripts": {
"start": "cross-env REACT_APP_NODE_ENV=development node scripts/start.js",
"build": "cross-env REACT_APP_NODE_ENV=development node scripts/build.js",
"start:prod": "cross-env REACT_APP_NODE_ENV=production node scripts/start.js",
"build:prod": "cross-env REACT_APP_NODE_ENV=production node scripts/build.js",
"test": "node scripts/test.js"
},
运行项目后配置文件中的变量自动挂载到process.env对象下,直接引用即可
比如运行了npm start后,在项目中使用process.env.REACT_APP_apiUrl就能取值http://localhost:5000/api