Electron + ReactJS: how to make system calls?

Question

I can't make it work,

const { exec } = require("child_process");

TypeError: spawn is not a function

TypeError: exec is not a function

I want to execute "git status" throw the system call in my electron app, does anybody could make it work??

This is mi code:

const path = require('path');

const { app, BrowserWindow } = require('electron');
const isDev = require('electron-is-dev');

function createWindow() {
    // Create the browser window.
    const win = new BrowserWindow({
        width: 800,
        height: 600,
        titleBarStyle: "hiddenInset",
        transparent: true,
        webPreferences: {
            nodeIntegration: true,
            contextIsolation: false,
            enableRemoteModule: true
        }
    });

    // and load the index.html of the app.
    // win.loadFile("index.html");
    win.loadURL(
        isDev
            ? 'http://localhost:3000'
            : `file://${path.join(__dirname, '../build/index.html')}`
    );
    // Open the DevTools.
    if (isDev) {
        win.webContents.openDevTools({ mode: 'detach' });
    }
}

// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.whenReady().then(createWindow);

// Quit when all windows are closed, except on macOS. There, it's common
// for applications and their menu bar to stay active until the user quits
// explicitly with Cmd + Q.
app.on('window-all-closed', () => {
    if (process.platform !== 'darwin') {
        app.quit();
    }
});

app.on('activate', () => {
    if (BrowserWindow.getAllWindows().length === 0) {
        createWindow();
    }
});

App.js

import React from 'react';
import './App.scss';

import {ThemeProvider, createTheme} from '@mui/material/styles';
import {TokenConsumer, TokenProvider} from "./hooks/tokensContext";

import Login from "./components/Login";
import StrategicPartnerTabs from "./components/StrategicPartnerTabs";
import {UserConsumer, UserProvider} from "./hooks/userContext";

const { exec } = require("child_process");


const darkTheme = createTheme({
    palette: {
        mode: 'dark',
    },
});

const Providers = ({children}) =>
    <ThemeProvider theme={darkTheme}>
        <TokenProvider>
            <UserProvider>
                {children}
            </UserProvider>
        </TokenProvider>
    </ThemeProvider>


const App = () => {
    exec('echo "HELLO"', function (error, stdout, stderr) {
        console.log(error);
        console.log(stdout);
        console.log(stderr);
    });
    return (
        <Providers>
            <div className="app">
                <UserConsumer>
                    {() =>
                        <TokenConsumer>
                            {({tokens}) => (
                                <>
                                    {tokens ? <StrategicPartnerTabs/> : <Login/>}
                                </>
                            )}
                        </TokenConsumer>
                    }
                </UserConsumer>
            </div>
        </Providers>
    );
};

export default App;