how to solve this Expected an assignment or function call and instead saw an expression no-unused-expressions

Question

problem :

./src/components/main.js Line 7: Expected an assignment or function call and instead saw an expression no-unused-expressions

Search for the keywords to learn more about each error.

import React from 'react';
import { Switch, Route } from 'react-router-dom';
import LandingPage from './landingpage'

const Main = () => {
   <Switch>
      <Route exact path="/" component={LandingPage}/>
   </Switch>
}

export default Main;

how can i solve this, please help me

Answer 1

You're missing a couple of things. First you need to import BrowserRouter or Router from react-router-dom . And you need to return your Router.

import React from 'react';
import { Switch, Route, BrowserRouter } from 'react-router-dom';
import LandingPage from './landingpage'

const Main = () => {
   return(
     <BrowserRouter>
       <Switch>
         <Route exact path="/" component={LandingPage}/>
       </Switch>
     </BrowserRouter/>
   )
}

export default Main;

Answer 2

Just Change Bracket Braces To parenthesis. when you write JSX inside the function you need to use parenthesis not Bracket because your function has JSX. {}=>()

import React from 'react';
import { Switch, Route } from 'react-router-dom';
import LandingPage from './landingpage'

const Main = () => (
   <Switch>
      <Route exact path="/" component={LandingPage}/>
   </Switch>
)

export default Main