reactjs - 如何在构建期间将环境变量注入(inject) React

Question

我目前正在使用 Neutrinojs，并且已经被 v8 引起的兼容性问题弄得焦头烂额。解决方案似乎是“使用 Neutrino v.9 beta”，但在那种情况下，我在 v.8 中依赖的许多功能都变得很奇怪。

特别是最近对 WebPack 的更改使 Neutrino 8 不稳定，我不得不打补丁

以下是我执行的任务类型:

• 将 env 变量导入 React 以获得诸如 Auth0 客户端 ID 之类的值
• 自定义 html/链接以引入 css、字体等
• eslint 验证代码
• 编写 Jasmine 测试
• 在构建中包含静态文件/文件夹
• 有一个响应路由器 url 的开发者服务器:即，localhost:5000/users/bob 在不入侵开发者服务器的情况下不会在 Neutrino 中加载。

鉴于我希望“不是 Neutrino”，React 构建系统的工作原理是什么？它如何让您处理/自定义这些功能？

提前致谢大卫·埃德尔哈特

我一直在使用 Neutrino v.8，但其中许多任务都需要大量定制，而且它存在间歇性的内存问题，尽管该站点实际上很小。

Answer 1

如果您使用 CRA (create-react-app)，任何不以 REACT_APP_ 开头的环境变量都将被删除。因此，您需要将环境变量命名为 REACT_APP_AUTH0_CLIENT_ID。要注入(inject)自定义环境变量，您可以使用 cross-env 或 .env 文件。

更多信息:https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables