添加 Twitter 组件时，出现错误并且网站无法加载答案

【问题标题】：While adding a Twitter component, getting error and site not loading添加 Twitter 组件时，出现错误并且网站无法加载
【发布时间】：2022-08-04 02:20:54
【问题描述】：

在添加 Twitter 组件时，我在我的 react hooks 网络应用程序中收到Uncaught ReferenceError: process is not defined，有人可以就这个问题提出建议吗？在查看互联网问题后，我也尝试在 App.js 中添加以下window.process。尝试了一些其他选项，例如删除``` node_modules & package-lock.json`，将反应脚本更新到 5.0.1 版本。

useEffect(() => {
    window.process = {
      ...window.process,
    };
  }, []);

npm version: 8.5.0 已安装，下面是我的 package.json

 \"devDependencies\": {
    \"react-error-overlay\": \"^6.0.9\"
  },
  \"overrides\": {
    \"react-error-overlay\": \"6.0.9\"
  }

//twitterFeeds.js

 import React from \'react\';
    import TweetEmbed from \'react-tweet-embed\'
    
    const TwitterFeeds = () => {
        return (
          <div className=\"wrapper\">
              <div className=\"row\">
                    <div className=\"twitterfeeds\">
                    <TweetEmbed id=\"some_id\" placeholder={\'loading\'} />
                    </div>
              </div>
          </div>
        )
      }
      export default TwitterFeeds

//BottomLevel.js

import React from \'react\';
import Twitter from \"../home/twitterFeeds\";



const BottomLevels = () => {
    return (
             <div className=\"wrapper>
               <div className=\"row\">
                <div className=\"column5\">
                    <h3><div className=\'hyphen\'></div>Skills</h3>
                    
                </div>
                <div className=\"column6\">
                    <div className=\"soccerdays\">
                    <img src=\"images/adv.png\"></img>
                </div>
                </div>
            </div>

              <div className=\"row\">
                <Twitter/>
            </div>
          </div>
)};
export default BottomLevels

//App.js

import React, { useEffect, useState } from \'react\';
function App() {
  useEffect(() => {
    window.process = {
      ...window.process,
    };
  }, []);
  return (
    <BrowserRouter>
    <Navigation />
        <Routes>
          <Route path=\"/\"  element={<Home />}>
          </Route>
          <Route path=\"/aboutUs\"  element={<AboutUs />}>
          </Route>
        </Routes>
    </BrowserRouter>
  );
}
export default App;

关于这个问题的任何解决方案。我已经尝试删除``node_modules, package-lock.json``，将反应脚本更新到 5.0.1 版本

标签： reactjs react-hooks

【解决方案1】：

process 对象仅存在于 Node.js 环境中。无法从浏览器访问它。

【讨论】：