javascript - 引用错误 : process is not defined when requiring Shelljs in ReactJS

Question

我试图在我的核心 React 组件中要求 shelljs。

import React, { Component } from 'react';
import {render} from 'react-dom';
import Header from './components/Header';

const shell = require('shelljs');

class App extends Component {
    render() {
        console.log("First component mounting");
        console.log("First component mounting");
        return (
            <Header />
        )
    }
}

render(<App />, document.getElementById('root'));

当我运行时

webpack build

我没有收到任何错误，然后我运行我的服务器并收到以下控制台错误。

我使用 jekyll 作为我的服务器端。目前正在从普通的 jekyll 实现过渡到仅 React。React 实现良好，因为我在导入 shelljs 模块之前测试了 Header 组件

ReferenceError: process is not defined

我不熟悉在 javascript 中使用模块，在此先感谢。

Answer 1

我猜你不是真的要使用你的 shell 常量，因为你没有在你的 React 组件中的任何地方引用它。 Shelljs 看起来是一个专门针对命令行的工具。

至于你的错误:

process 是 Node 环境中的全局变量。由于 React 在浏览器中运行，并且您的组件将在浏览器中呈现，因此 process 将不存在于您的组件的上下文中。

尝试打开 Chrome DevTools(或您使用的任何浏览器的开发者工具)并输入 process。你会得到一个 TypeError 因为它不存在。然而，确实存在的是全局 window 变量。

现在，打开命令行并键入 node 以打开 Node.js REPL。在此处键入 process，您会看到它是一个包含许多属性和值的对象。接下来，键入 window 并按回车键。 window 在这里不存在，因为它只存在于浏览器中。

(键入 Ctrl+C 两次以退出 Node btw。:])