Node.js代码必须由节点进程运行，而不是浏览器（代码必须在服务器中运行）。
要运行代码，必须运行以下命令：

node server.js

然后你可以通过输入“http://localhost:8080“从浏览器访问你的服务器，例如，你必须有一个文件server.js（或任何东西），里面有你想要的服务器代码（在本例中，在端口8080创建一个web服务器）。
你可以按照这个简单的例子，使用express作为http服务器模块：http://expressjs.com/starter/hello-world.html

Webpack可以将环境变量注入到“客户端”.js代码中（在SPA/PWA的情况下非常有用）。

webpack.config.js

module.exports = {
plugins: [
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
      'process.env.MY_ENV': JSON.stringify(process.env.MY_ENV),
      ... and so on ...
    })
],
}

现在您可以在客户端访问它：

app.js

// Something like that
if(process.env.NODE_ENV === 'debug'){
    setDebugLevel(1)
}

如果您正面临这个问题，并且正在使用webpack，那么可以通过在webpack.config.js中使用DefinePlugin，将所需的process数据注入到客户机包中。
在下面的示例中，我展示了如何向process.env对象添加一些内容，以使其在浏览器中可用：
1.使用库dotenv的.env内的所有环境变量

1. NODE_ENV的值，该值为'development'或'production'

工作示例

# .env

API_KEY=taco-tues-123
API_SECRET=secret_tacos

// webpack.config.js

const dotenv = require('dotenv').config({ path: __dirname + '/.env' })
const isDevelopment = process.env.NODE_ENV !== 'production'

module.exports = {
  plugins: [
    new webpack.DefinePlugin({
      'process.env': JSON.stringify(dotenv.parsed),
      'process.env.NODE_ENV': JSON.stringify(isDevelopment ? 'development' : 'production'),
    }),
  ].filter(Boolean),
}

// Within client side bundle (React)
// src/App.jsx

console.log(process.env)          // {API_KEY: "taco-tues-123", API_SECRET: "secret_tacos"}
console.log(process.env.NODE_ENV) // development

请注意，console.log(process.env)仅具有.env文件中的值，并且NODE_ENV不是process.env对象的一部分。
在下面的例子中，我展示了我是如何尝试注入导致堆栈溢出的process.env对象的，我还包括了webpack文档中的一个亮点，说明下面的代码为什么不起作用。

破碎的例子

一个三个三个一个
来自网络包DefinePlugin docs：
定义过程首选值时出现警告
'process.env.NODE_ENV': JSON.stringify('production')
超过
process: { env: { NODE_ENV: JSON.stringify('production') } }
使用后者将覆盖流程对象，这可能会破坏与某些模块的兼容性，因为这些模块希望在流程对象上定义其他值。
警告!
将dotenv.parsed注入到客户端包中会将这些秘密暴露给客户端，对于开发目的来说，这不是什么大问题，但是在部署的生产环境中，任何密码或api私钥都将对任何寻找它们的人可见。

我也遇到过同样的问题，通过进入我的Ideeslintrciderjs文件配置我的全局变量，向全局变量添加require和process，并将相应的值设置为“可写”来解决它。希望它对你有用。
这个链接对www.example.com很有帮助https://eslint.org/docs/user-guide/configuring#specifying-globals

可以将以下内容添加到package.json文件中

{
"name": "mypackage",//default
"version": "0.0.1", //default
"eslintConfig": {
    "env": {
        "browser": true,
        "node": true
    }
}}

更多说明

我有同样的问题，当我尝试做这个节点js应用程序：https://www.youtube.com/watch?v=mr9Mtm_TRpw
html中的require是从到达的< script>，但未定义，如

<script> require('./renderer.js');</script>

我把它改成了：

<script src="./renderer.js"></script>

html脚本中的过程也没有定义。我包括了webPreferences：js文件中的节点集成：

win = new BrowserWindow({
    width: 800, 
    height:600, 
    icon: __dirname+'/img/sysinfo.png', 
    webPreferences: {
        nodeIntegration: true
    }
});

希望能帮上忙。

我刚在一个本地热重载Quasar（Vue）应用程序中调用一个特定的端点时遇到这个错误（Uncaught ReferenceError: process is not defined）。我的修复方法是重新启动热重载服务器（自从添加process.env.MY_VARIABLE代码后，我就没有重新加载过它）。

如果您使用的是带有Webpack 3的npm模块dotenv-webpack，那么可能是因为您使用的是解构，如下所示：
const { ENV1, ENV2 } = process.env;
这是一个known issue。
糟糕的解决方案是：

const { ENV1 } = process.env;
const { ENV2 } = process.env;

如果您按照此处的所有答案操作，但仍然遇到相同的错误，请尝试此操作。该错误是由react-error-overlay包导致的，该包具有已更新为支持webpack v5的依赖项，但与react-scripts v4不兼容。因此，要解决React中的Uncaught ReferenceError: process is not defined问题，在你的项目的根目录中打开你的终端并且通过运行npm install react-scripts@latest更新你的react-scripts包的版本并且如果需要的话重新安装你的依赖项。您可以在here中找到更详细的答案