Visual Studio Code VM9623 Uncaught ReferenceError: process is not defined答案

【问题标题】：Visual Studio Code VM9623 Uncaught ReferenceError: process is not definedVisual Studio Code VM9623 Uncaught ReferenceError: process is not defined
【发布时间】：2022-01-02 14:22:54
【问题描述】：

我正在使用 VSCode 和 Google Chrome 开发 React 应用程序。每次我在 VSCode 上保存我的 React 应用程序中的更改时，它都会刷新 Chrome 页面，但奇怪的是它会在整个页面上添加一个覆盖 iframe，并且不再可以点击任何内容。这是添加的 iframe 的 html 代码：

<iframe style="position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; border: none; z-index: 2147483647;">
<html data-lt-installed="true">
<head></head>
<body>
<script type="text/javascript">[THE CONTENT OF THE SCRIPT IS SO LONG THAT I CANNOT COPY IT HERE!]</script>
</body>
</html>
</iframe>

此外，它在控制台中为我提供了来自 VM9623:2 的以下错误代码：

Uncaught ReferenceError: process is not defined
at Object.4043 (<anonymous>:2:13168)
at r (<anonymous>:2:306599)
at Object.8048 (<anonymous>:2:9496)
at r (<anonymous>:2:306599)
at Object.8641 (<anonymous>:2:1379)
at r (<anonymous>:2:306599)
at <anonymous>:2:315627
at <anonymous>:2:324225
at <anonymous>:2:324229
at HTMLIFrameElement.e.onload (index.js:1)

问题通过刷新页面得到解决，但令人沮丧的是每次我在 VSCode 上保存更改时，我都必须再次手动刷新页面！

【问题讨论】：

标签： google-chrome npm visual-studio-code create-react-app react-scripts

【解决方案1】：

如果升级到 react-scriptsv5 不适合您，您还可以尝试另一种替代方案，该替代方案已在 6.0.9 版的 react-error-overlay 中修复：所有这些都到你的 package.json React Uncaught ReferenceError: process is not defined

将它添加到我的 package.json 对我有用

"devDependencies": {
   "react-error-overlay": "6.0.9",
}

文章链接： https://github.com/facebook/create-react-app/issues/11773

【讨论】：

【解决方案2】：

对我来说，以下工作：

//reset-css file or css global file
iframe {
  display: none !important;
}

记住这个错误只发生在开发环境中，从生产环境构建可以正常工作，显然这是一个反应热刷新问题

这里说：

https://github.com/facebook/create-react-app/issues/11773#issuecomment-995415266

【讨论】：