리액트 return 으로 html 전달이 안 되어요

따라하며 배우는 노드, 리액트 시리즈 - 기본 강의

작성

299

안녕하세요 강사님 ! 강의 틈틈히 잘 보고 있습니다.

다름 아니라 react router dom 수업 진행 중 react 사이트에서 긁어온 router dom 을 실행하는 부분에서 안 되는데요ㅠㅠ..

return 안의 html 태그 전달에서 오류가 납니다...

SyntaxError: Unexpected token '<'

at Loader.moduleStrategy (internal/modules/esm/translators.js:145:18)

at async link (internal/modules/esm/module_job.js:47:21)

라는 에러가 나는데

구글링 하며 이것저것 시도해보는데도 여전히 이 부분만 막혀서요... 오류는 아래와 같이 뜹니다..ㅠㅠ

import React from "react";

function App() {
<div>test</div>
}

export default App;

답변 2

지식공유자

안녕하세요

아마 소스 코드 문제보다는 모듈 설치시 문제가 생긴 경우일수도 있는데
위에 주신 정보로는 문제를 찾기가 힘들것 같습니다 ㅠㅠ
전체 깃허브 저장소 같은걸 같이 올려주셔야할것같습니다 ~~~

저도 리액트 초보지만 SyntaxError: Unexpected token '<' 이고

client/src/App.js에서 문제가 난거 같은데 이렇게만 아직 해결 못하셨다면

소스코드를 올려주시면 좋을거 같습니다ㅠ

질문자

앗 넵 방금 수정했습니다..

아예 html 태그만 넣으면 오류가 나는 상황이고 안 넣으면 따로 오류가 없더라구요ㅠ

return이 빠졌어요!

html을 두줄이상 쓸때는 return 소괄호에 감싸주는거 잊지마세용 (제가 그랬거든요ㅎㅎ)

import React from "react";

function App() {
 return <div>test</div>
}

export default App;

질문자

앗 리턴을 써두 안 되네요 ㅠㅅㅠ... (ㅠㅠ..??????????)ㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠ

아예 return 안에 html 태그를 못 받네요ㅠㅅ ㅠ

흐음... 뭐가 문제일까요ㅠㅜ

git url이나 codesandbox에 (https://codesandbox.io/s/react-new)

모든 파일의 코드를 복사 붙여넣기 해주시면 함께 볼 수 있을거같습니다.

인프런 커뮤니티 질문&답변