I am trying to require shelljs in my core React ponent.

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

const shell = require('shelljs');

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

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

When I run

webpack build

I get no errors, then I run my server and I get the following console error.

I'm using jekyll as my server side. Currently transitioning from the normal jekyll implementation to React only. React is well implemented cause i tested the Header ponent before importing the shelljs module

ReferenceError: process is not defined

I'm new to using modules in javascript, thanks in advance.

I am trying to require shelljs in my core React ponent.

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

const shell = require('shelljs');

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

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

When I run

webpack build

I get no errors, then I run my server and I get the following console error.

I'm using jekyll as my server side. Currently transitioning from the normal jekyll implementation to React only. React is well implemented cause i tested the Header ponent before importing the shelljs module

ReferenceError: process is not defined

I'm new to using modules in javascript, thanks in advance.

• javascript
• reactjs
• npm
• ecmascript-6
• shelljs

• could you add the code/mands you are using to run your server too, please? – thesublimeobject Commented Jan 22, 2017 at 0:54
• Updated description – Goamaral Commented Jan 22, 2017 at 1:02
• yeah, everything i can see looks fine, but i'm not very familiar with jekyll so i might not be much help. sorry. – thesublimeobject Commented Jan 22, 2017 at 1:06
• I am not really experience but as reactJs is pletely frontend, the backend I use shouldnt even matter. Jekyll is only used to serve the HTML where the Components will be mounted. Correct me if Im wrong – Goamaral Commented Jan 22, 2017 at 1:33
• yeah, but if you said you built it without any errors first, i guess i'm confused on where that error is ing from – thesublimeobject Commented Jan 22, 2017 at 1:43

1 Answer 1

I'm going to guess you don't really mean to use your shell constant since you haven't referenced it anywhere within your React ponent. Shelljs looks like it's a tool specifically for the mand line.

As for your error:

process is a global variable in the Node environment. Since React runs in the browser, and your ponent is going to render in the browser, process will not exist in the context of your ponent.

Try opening the Chrome DevTools (or the developer tools for whatever browser you use) and type in process. You'll get a TypeError because it doesn't exist. What does exist, however, is the global window variable.

Now, open the mand line and type node to open the Node.js REPL. Type process here, and you'll see that it's an object holding a lot of properties and values. Next, type window and press enter. window does not exist here because it only exists in the browser.

(Type Ctrl+C twice to exit Node btw. :])