1诗良、eject導(dǎo)出webpack配置
npm run eject
2、安裝包
npm install -D dotenv-cli react-app-rewired
3鲁驶、在根目錄創(chuàng)建 config-overrides.js 定義配置
module.exports = function override(config, env) {
return config;
}
4鉴裹、在根目錄創(chuàng)建.env.development、.env.production文件
// .env.development
REACT_APP_ENV=development
// .env.production
REACT_APP_ENV=production
5、修改 package.json 中的 scripts
"scripts": {
"start": "react-app-rewired start",
"build:dev": "dotenv -e .env.development react-app-rewired build",
"build:pro": "dotenv -e .env.production react-app-rewired build",
},
6径荔、輸出 process.env
// html中：
%REACT_APP_ENV%
// js/jsx中：
console.log(process.env)
7督禽、運(yùn)行測試
// 開發(fā)環(huán)境
npm start
// 打包測試環(huán)境
npm run build:dev
// 打包生產(chǎn)環(huán)境
npm run build:pro
注：
1.必須以 REACT_APP_ 開頭創(chuàng)建自定義環(huán)境變量，除了 NODE_ENV 之外的任何其他變量都將被忽略总处。
2.重載后可能會(huì)出現(xiàn)缺少react-scripts插件狈惫，安裝即可npm install --save react-scripts。
