ReferenceError: 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 两次以退出节点 btw。:])

ReferenceError: process is not defined when requiring Shelljs in ReactJS

ReferenceError: process is not defined when requiring Shelljs in ReactJS

javascript

npm

ecmascript-6

reactjs

shelljs