// src/Login.tsx
const Login = () => {
<h1>Success</h1>;
};
export default Login;
// src/Router.tsx
export default () => {
const CLIENT_ID = process.env.REACT_APP_KAKAO_API_KEY;
const REDIRECT_URI = "http://localhost:3000/api/user/kakao/callback";
const KAKAO_AUTH_URL = `https://kauth.kakao.com/oauth/authorize?client_id=${CLIENT_ID}&redirect_uri=${REDIRECT_URI}&response_type=code`;
return (
<Router>
<div className="App">
<Switch>
<Route exact path="/">
<h1>
<a href={KAKAO_AUTH_URL}>
<Login />
</a>
</h1>
</Route>
<Route path="/oauth/kakao/callback">
<Auth />
</Route>
<Route path="/profile">
<Profile />
</Route>
</Switch>
</div>
</Router>
);
};
I see an error.. 'Login' cannot be used as a JSX component.Its return type 'void' is not a valid JSX element.
I tried to reference it on here, but I can't find a solution. What should I do?
Login
component :S() => { <h1>...</h1> }
doesn't return anything either ad areturn
or remove the braces{}