Module not found: Can't resolve 'dns' (수정중)

내 환경 정보

-

{
  "name": "nextjs-course",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "dotenv": "^16.0.3",
    "next": "^13.1.1",
    "react": "^18",
    "react-dom": "^18",
    "dns": "file:./src/mock/dns"
  }
}

 결론부터 말하면 "dns": "file:./src/mock/dns" <- 이게 해결책이고, 이 부분이 내가 임의로 만든 짜가 패키지가 위치하는 경로다. 

 

상황

-

/* /pages/[meetupId]/index.js */

import { MongoClient, ObjectId } from "mongodb";
//이거 import하면 에러메시지가 보인다.

Module not found: Can't resolve 'dns' 
/* mongodb의 document를 id로 호출하려함.
ObjectId가 필요함. 
해서, ObjectId를 import 하니,이러한 에러 표시 됨 */

 

이유

-

패키지 중 하나가 dns 모듈에 의존하는 JavaScript promise를 사용하기 때문에 발생
Node.js(서버 측)에서만 사용할 수 있고 코드가 브라우저에서 실행될 때는 사용할 수 없다. 
구현은 그것에 의존하지만 작동하는 데 필요하지 않으므로 dns 모듈의 존재를 가장하여 문제를 해결할 수 있습니다.

 

해결

- 가짜로 dns 패키지를 만들어 넣었다.  전혀 좋은 방법이 아니라 생각하며 이른바 몽키패치 에 가깝다.  getStaticProps에서 mongodb connection을 여는 부분에서 생긴 문제다. (샘플 코드라서 이부분에 같이 있습니다.) 즉 내 코드에서도 서버사이드에서만 console.log가 출력되고, 브라우저에서 찍히는 것도 아니다. 브라우저에서 실행될때는 사용할 수 없는 모듈에 의존하기때문에 라는데... 음... 

https://stackoverflow.com/a/51781959/10194999

 

어찌 됐든, 위 답변으로 

import { MongoClient, ObjectId } from "mongodb";

이것을 import 할 수 있었다. 정석적 문제 해결이라기보다는, 사용하지 않는 모듈임에도 의존성이 있기에. 가짜로 추가한;;; 안좋은 방법이 되시겠다. 일단 적어두고 다른 문제 해결 후 돌아오련다. 

 

---

참고

- https://stackoverflow.com/questions/51541561/module-not-found-cant-resolve-dns-in-pg-lib