search

JaeSeoKim / react-kakao-maps-sdk

React components for using kakao map api
https://react-kakao-maps-sdk.jaeseokim.dev
MIT License
275 stars 30 forks source link

nextjs에서 Must use import to load ES Module: node_modules\react-kakao-maps-sdk\lib\index.modern.js #2

Closed winxec closed 2 years ago

winxec commented 2 years ago

nextjs 사용중입니다. 코드 `import { Map, MapMarker } from 'react-kakao-maps-sdk';

const KakaoMapSample = () => { return ( <Map center={{ lat: 33.5563, lng: 126.79581 }} style={{ width: '100%', height: '360px' }}

<MapMarker position={{ lat: 33.55635, lng: 126.795841 }}> <div style={{ color: '#000' }}>Hello World!

); };` Server Error Error: Must use import to load ES Module: \node_modules\react-kakao-maps-sdk\lib\index.modern.js require() of ES modules is not supported. require() of \node_modules\react-kakao-maps-sdk\lib\index.modern.js from .next\server\pages\sample\kakaomapsample.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules. Instead rename index.modern.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from \node_modules\react-kakao-maps-sdk\package.json.

JaeSeoKim commented 2 years ago

nextjs: 11.1.2 버전을 기준으로 테스트 해본 결과 해당 오류는 발생하지 않습니다. useLayoutEffect 에 대한 SSR 경고는 발생하지만 위에서 설명한 ESM 관련 오류는 발생하지 않네요. 구체적인 상황 또는 해당 상황을 재현한 코드를 올려주시면 감사하겠습니다.