[next.js] typeorm 사용시 Critical dependency: the request of a dependency is an expression / module not found: Can't resolve 'X' in with new Next.js project 에러

 

next.js에서 서버 컴포넌트에서 typeorm을 사용한 db접속을 구현 하고 있었다.

db 접속, query 실행등은 정상적으로 작동했으나.  엄청난 수의 "Critical dependency: the request of a dependency is an expression" 에러 메시지가 발생했다... 보아하니 typeorm 패키지의 종속성 문제인듯 하였다.

 

애꿎은 package.json만 여러번 만지던중 typeorm github에서 이미 해당 issue가 report된 것을 확인하였다!

https://github.com/typeorm/typeorm/issues/10047 

Plenty of `Module not found: Can't resolve 'X' in` with new Next.js project · Issue #10047 · typeorm/typeorm

 

해결 법은 간단하다. 

next.config.js에

const path = require("path");

/** @type {import('next').NextConfig} */
const nextConfig = {
  experimental: {
    serverComponentsExternalPackages: ["typeorm"],
  },
};

module.exports = nextConfig;

를 넣어주면 된다.

 

서버 컴포넌트의 외부 패키지를 강제로 잡아 주는 것 같다.

을 해주는 녀석이란다.

 

https://nextjs.org/docs/app/api-reference/next-config-js/serverComponentsExternalPackages

next.config.js Options: serverComponentsExternalPackages | Next.js

serverComponentsExternalPackages는 Server Components bundling시, 혹은 node.js에서 require 함수를 사용시 opt-out specific dependencies를 설정해 주는 거라고 한다. 이 의미는 서버 구성요소로 사용할 외부 패키지를 typeorm으로 지정 해준다는 의미 이다.