라이브러리를 commonjs 기반으로 생성해야하는 이유

Turborepo를 사용하다보면 다양한 자체 라이브러리 및 패키지들을 만들어 쓰게 된다. Moonjin 서비스에서 백엔드 부분은 Nestjs로 구현되었는데, Nestjs는 es6기반의 라이브러리를 직접 쓸 수 없게 설정되어 있었다. 따라서 Nesjs에서도 다른 패키지들을 사용할 수 있게끔 commonjs 기반으로 패키징할 필요가 있었다. 본 글은 그 과정을 정리하기 위해 작성했다.

1. Package 생성

package 생성하는 부분은 아레의 Turborepo 공식 Docs에 가장 깔끔하고 정확하게 정리되어 있다. 여기까지는 따라해보며 만들어보자.

Internal Packages – Turborepo

2. Commonjs 로 빌드하기 (node.js)

Why?

• 위에서도 작성했듯 nodejs 에선 commonjs 형식으로 패키지를 가져오기 때문에, 만약 라이브러리를 ES6 이후 버전으로 패키징하면 NestJs 에서 못 불러온다.

tsconfig.json

• “module”: “commonjs”: commonjs 형식으로 compile
• “moduleResolution”:”node” : node 형식

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
{
  "compilerOptions": {
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "isolatedModules": true,
    "module": "commonjs",
    "moduleResolution": "node",
    "preserveWatchOutput": true,
    "skipLibCheck": true,
    "declaration": true,
    "strict": true,
    "outDir": "dist"
  },
  "exclude": ["node_modules","src","dist"]
}

• 그 이외에도 caller 쪽에서 typescript 로 사용하려면 “declaration”:”true” 옵션을 켜준다.

package.json

• tsc 로 index.ts 를 빌드한 후, main 과 types 에선 빌드된 친구들을 지목한다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
{
  "name": "@moonjin/api-types",
  "main": "./dist/index.js",
  "types": "./dist/index.d.ts",
  "dependencies": {
    "tsconfig": "*"
  },
  "devDependencies": {
    "typescript": "latest"
  },
  "scripts": {
    "build": "tsc"
  }
}

이후 root 에서 yarn install 를 수행하면, @package명/dist 에 담긴 친구들을 node_modules 에 담는다.

dependency

• 다음 명령어를 수행하여 원하는 app 에서 해당 package 를 불러온다

1
yarn workspace app명 add @package명

이 후 해당 app 에 package.json에 가면 해당 dependences 가 추가되어 있다.