whats wrong in this react code? showing error Module not found: Can't resolve 'react ' in 'C:\Users\hp\weather\src\components'..

Question

import {useEffect} from 'react ';
import {Box, TextField, Button, makeStyles} from '@material-ui/core';
import {getData} from '../service/api.js';

const useStyles= makeStyles({
component:{
padding:20,
backgroundColor:'rgba(255, 120, 205,0.2)'
},

input:{
color:'blue',
marginRight:15,
marginLeft:15,

},
button:{
width:100,
height:40,
marginLeft:10,
marginTop:5,
backgroundColor:'rgba(173, 14, 88,0.3)'
}

})
const Form= ()=> {
const classes=useStyles();

useEffect(()=>{
getData(),then(data =>{
console.log(data)
})

},[]);
return (
<Box className={classes.component}>
<TextField id="standard-basic" label="Enter Your City"
inputProps={{className:classes.input}}
className={classes.input}
/>
<TextField id="standard-basic" label="Enter Your Country" inputProps={{className:classes.input}} />
<Button variant="outlined"
className={classes.button}

>Search</Button>
</Box>
)
}
export default Form;

Answer 1

Shweta i suggest you take a revision on React course step by step to fully understand its feature.Then try work on simple projects before moving to complex.

Answer 2

Shweta see you in form function inside useEffect you have done a mistake
Its
getData().then(data=>......);

No getData(),then(data=>...);

Its "." Not ","
Also use
import React, {useEffect} from 'react ';

Answer 3

Try remove package-lock.json and then run npm install

Answer 4

Start from the bare src codes, you need to delete your node_modules, package-lock.json, yarn.lock

then run
npm install

notice any errors arise from installation

Answer 5

what to do now please help :(

Answer 6

thank you @Andrew

Answer 7

sure, @Apongpoh Gilbert will keep that on my mind

Answer 8

Error from chokidar (C:\): Error: EBUSY: resource busy or locked, lstat 'C:\DumpStack.log.tmp' showing same error with this error also @Apongpoh Gilbert

Answer 9

./src/components/Form.jsx
Module not found: Can't resolve 'react ' in 'C:\Users\hp\weather\src\components'

showing this error now

Answer 10

Change
import {useEffect} from 'react ';

To
import React, {useEffect} from 'react ';

Answer 11

×
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

Check the render method of `Form`.
▶ 21 stack frames were collapsed.
./src/index.js
C:/Users/hp/weather/src/index.js:8
5 | import reportWebVitals from './reportWebVitals';
6 |
7 |
> 8 | ReactDOM.render(
9 | <React.StrictMode>
10 | <App />
11 | </React.StrictMode>,
View compiled
▶ 6 stack frames were collapsed.
This screen is visible only in development. It will not appear if the app crashes in production.
Open your browser’s developer console to further inspect this error.

Answer 12

hello please help.me how learn python programing

Answer 13

please

Answer 14

thank you @calvin