Reputation: 81

Parsing error: require() of ES Module not supported

I was coding and out from nothing I'm getting this error and I don't know what to do. I've tried everything on stackoverflow and other sites already and nothing works The Error

Failed to compile ./src/components/User/UserTabs.js

Line 0: Parsing error: require() of ES Module C:\Users\Taynara\Desktop\projeto-adote\client\node_modules\eslint\node_modules\eslint-scope\lib\definition.js from C:\Users\Taynara\Desktop\projeto-adote\client\node_modules\babel-eslint\lib\require-from-eslint.js not supported. Instead change the require of definition.js in C:\Users\Taynara\Desktop\projeto-adote\client\node_modules\babel-eslint\lib\require-from-eslint.js to a dynamic import() which is available in all CommonJS modules

The code from the page referent to the error

    import React, {useState} from 'react'
    import { Tabs, Tab, Box, Divider, } from '@material-ui/core'
    import { TabPanel, TabContext, TabList } from '@material-ui/lab'

    import LikedPosts from './content/LikedPosts';
    import Animals from '../Form/Animals'
    import Events from '../Form/Events'
    import Users from '../Form/Users'
    import Cnpj from '../Form/Cnpj'
    import Shelter from '../Form/Shelter'




    const User = () => {

      const [selectedTab, setSelectedTab] = useState('4');
     
      const handleChange = (event, newValue) => {
        setSelectedTab(newValue);
      };
      const [currentId, setCurrentId] = useState(0);

      return (


        <>

          <TabContext value={selectedTab} onChange={handleChange} >
            <Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
              <TabList onChange={handleChange} variant="scrollable">
                <Tab label="Likes" value="1" />
                <Tab label="Postagens" value="2" />
                <Tab label="Registrar Animal" value="3" />
                {/**Implementar if de tipo de usuário */}
                <Tab label="Registrar Evento" value="4" />
                <Tab label="Usuário" value="5" />
                <Tab label="Pessoa Jurídica" value="6" />
                <Tab label="Abrigo" value="7" />
              </TabList>
              <Divider/>
            </Box>
            <TabPanel value="1"><LikedPosts /></TabPanel>
            <TabPanel value="2">Postagens</TabPanel>
            <TabPanel value="3"><Animals /></TabPanel>
            <TabPanel value="4">nada</TabPanel>
            <TabPanel value="5"><Users /></TabPanel>
            <TabPanel value="6"><Cnpj /></TabPanel>
            <TabPanel value="7"><Shelter /></TabPanel>
          </TabContext>
        </>
      );
    }
    export default User;

I can't see the error on the code, is it a dependence issue?

Upvotes: 7