create-react-app：使用.env文件或任何替代文件来管理不同的构建模式，而无需重新启动服务器

编程问答 2022-08-13

问题描述

我有一个React UI，并且使用 npm run build 进行生产构建。

现在我有一个新的要求，即我想在同一反应生产UI中使用2种不同的模式，并在我的应用程序的2个不同的地方使用它们

我的package.json 

{
  "name": "ftwebreport","homepage": ".","version": "0.1.0","private": true,"offlinemode": "no","scripts": {
    "start": "react-scripts start","build-offlineyes": "npe homepage . && npe offlinemode yes && react-scripts build","build-offlineno": "npe homepage /custom && npe offlinemode no && react-scripts build","build": "npm-run-all build-offlineyes /* HERE I COPY CONTENTS OF BUILD DIR TO RIGHT PLACE BEFORE ANOTHER BUILD STARTS */ build-offlineno",}
}

项目根目录中的我的.env文件

 REACT_APP_OFFLINE_MODE=${npm_package_offlinemode}

我如何在我的反应代码中使用

 console.log(process.env.REACT_APP_OFFLINE_MODE === "yes");

现在，当我执行 npm run build 时，我通过更改package.json的 homepage 和 offlinemode 属性来进行反应生产构建，并进行在正确的位置提供2种不同的React UI构建（此处未显示，但可以正常运行）。

我使用 npe（节点程序包编辑器）更改json文件，并使用 npm-run-all 来按顺序构建。

根据发现，我如何实现此目标，我知道我需要重启服务器才能切换env变量。

TIA

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

environment-variablespackage.jsonreactjsreactjs