[typescript] pnpm monorepo에서 paths 설정하기

코드

아래의 설명만으로는 부족하다.

https://github.com/insidedw/monorepo-pnpm-ts

GitHub - insidedw/monorepo-pnpm-ts

---

 

packages 구조

project
 - apps
   - calculator
     - src
 - libs
   - shared
     - src

 

root에 tsconfig.json 추가

baseUrl 기준으로 path를 지정

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@S_shared/*": ["libs/shared/src/*"],
      "@cal/*": ["apps/calculator/src/*"]
    }
  }
}

 

calculator sub pacakage에 tsconfig.json 추가

확장을 해서 가져와야 baseUrl이 변경되어 paths에서 선언한 값이 잘 먹힌다 

{
  "extends": "../../tsconfig.json",
}

 

calculator package에서 현 설정 값 확인

npx tsc --showConfig

{
    "compilerOptions": {
        "baseUrl": "../..",
        "paths": {
            "@S_shared/*": [
                "libs/shared/src/*"
            ],
            "@cal/*": [
                "apps/calculator/src/*"
            ]
        }
    },
    "files": [
        "./src/hello.ts",
        "./src/main.ts"
    ]
}

 

 

 

calculator에 tsconfig-paths devDeps 추가

pnpm add -D tsconfig-paths

 

main.ts 추가

import {getLength} from "@cal/hello";
import {add} from '@S_shared/utils'

const a = add(3, 5)
console.log('a', a)


const b = getLength('dddd')
console.log('b', b)

 

실행

ts-node -r tsconfig-paths/register ./src/main.ts

 

결과

a 8
b 4

 

 

https://blog.spiralmoon.dev/entry/Typescript-Module-%EC%A0%88%EB%8C%80%EA%B2%BD%EB%A1%9C-%EC%84%A4%EC%A0%95-%EB%B0%A9%EB%B2%95

[Typescript] Module 절대경로 설정 방법