Question

我有一个系统（碰巧是盖茨比，但我认为这与这个问题无关），它正在使用webpack DefinePlugin将一些EnvironmentVariables附加到全局变量：process.env

我可以读懂它。

不幸的是，由于应用启动过程中的问题，我需要选择在网站加载后对这些EnvironmentVariables进行简要覆盖。（在这个问题的背景下，没有兴趣讨论这是否是最佳选择。我知道还有其他选择；我想知道这是否可能）

但是它不起作用:(

如果我尝试明确地执行此操作：

process.env.myVar = 'foo';

然后我得到ReferenceError: invalid assignment left-hand side。

如果我通过索引器执行此操作（这似乎是dotenv所执行的操作），则它不会出错，但也无法正常工作：

console.log(process.env.myVar);
process.env['myVar'] = 'foo';
console.log(process.env.myVar);

将记录undefined两次。

我在做什么错了，该如何解决？

Answer 1

此尝试解决方案背后的前提存在缺陷。

给我的印象是webpack“使process.env。*可以作为浏览器中的对象使用”。

不是！

它的实际作用是在您引用process.env的任何地方将您的代码转换为文字。看起来像fetch(process.env.MY_URL_VAR)；实际上并没有引用变量，而是在编译时将其向下编译为fetch("http://theActualValue.com")。

这意味着从概念上讲不可能修改“ process.env对象”上的值，因为在已转译的javascript中实际上没有实际的对象。

这说明了为什么直接分配会产生ref错误（您尝试执行"someString" = "someOtherString";），但索引器却没有。（我假设process.env被编译成一些不同的文字，从技术上来说，它支持索引设置器）

唯一可用的解决方案是修改webpack的构建过程（不是一种选择，尽管我不久就会提出PR以使其成为可能:)），使用不同的过程将Env.Vars放入frontEnd（子-出于各种其他原因而处于最佳状态），或者利用盖茨比提供的各种环境控制措施使一切都变得正常（出于其他原因而令人讨厌）。