키워드 검색 데이터 받아오기 강의중 문제 발생

Question

카카오 api 받아서 지도 잘 작동하고 검색창도 떳는데 키워드 검색 데이터 받아오기 강의 들으면서 잘 따라갔는데 갑자기 안됩니다   upload.js:1 Uncaught ReferenceError: require is not defined at upload.js:1:20   f12누르니까 이렇게 나옵니다 ㅠㅠ   추가적으로 vs코드에서는 파일이 CommonJS 모듈입니다. ES 모듈로 변환될 수 있습니다.ts(80001) 이런 문구가 나오네요     +그래서 upload 파일은 무시하고 지도위에 저장한 데이터 표시하기 강의까지 들었는데 이번엔 main.js:1 Uncaught ReferenceError: require is not defined at main.js:1:20   이렇게 뜨네요 require 함수가 지금까지 잘 되다가 수업이 진행될수록 왜 문제가 될까요 ㅠㅠ

communityai8509 · Answer

안녕하세요, 인프런 AI 인턴입니다. 님의 문제는 특정 자바스크립트 문법이나 모듈 시스템의 사용 방법에 대한 이슈 같습니다. 여기서 require 는 Node.js 에서 모듈을 불러오기 위해 사용되는 함수이며, 웹 브라우저에서 직접적으로 사용될 수 없어 발생하는 오류입니다. 웹 브라우저 환경에서는 ES6 모듈 시스템을 사용하여 모듈을 불러올 수 있습니다. require 대신 import 키워드를 사용해 보세요. 예를 들어, 사용하고자 하는 모듈이나 라이브러리가 있다면 import 를 사용하여 불러옵니다. 예시는 다음과 같습니다. import moduleName from 'module'; 또한, VS 코드에서 나타난 &ldquo;파일이 CommonJS 모듈입니다. ES 모듈로 변환될 수 있습니다.&ldquo;라는 메시지는 현재 작업 중인 파일이 CommonJS 방식을 사용해 모듈을 관리하고 있음을 알리는 것이며, ES6 모듈 시스템으로 변경할 것을 권장한다는 정보입니다. 이를 해결하기 위해, JavaScript 파일 최상단에서 import 와 export 문법을 사용해 모듈을 관리하는 방식으로 변경해 보세요. 그리고 require 가 필요한 환경에서 작동해야 한다면, Node.js 환경에서 실행되고 있는지 확인하거나, 웹팩 같은 모듈 번들러를 사용하여 클라이언트 사이드 코드에서도 require 함수를 사용할 수 있도록 설정할 수 있습니다. 이러한 변경이 문제 해결에 도움이 되길 바랍니다. 추가 질문이 있으시면 언제든 문의해주세요.