TypeScript 라이브러리를 구축하고 있지만 이를 번들로 묶는 방법을 모르시나요? 쩝 추천합니다.

다음은 제가 고려하는 요소입니다.

1. NPM 레지스트리에서 주당 100만 건 이상의 다운로드를 기록하고 있습니다.

2. tsup 저장소에는 활성 유지 관리가 가능한 8.6,000개의 별이 있습니다.

3. 잘 문서화되어 있습니다.

4. shadcn-ui/ui CLI 패키지에서 사용됩니다.

5. tsup은 내부적으로 롤업을 사용합니다.

tsup 소스 코드를 살펴보니 Nodejs 작업자 스레드 관련 코드와 온갖 종류의 메시지 푸시 및 수신이 포함되어 있습니다. 이것은 공부하기에 재미있을 것입니다. 이것은 또한 번들러를 다루는 다른 영역으로 들어가게 된다는 것을 의미합니다. 아직 확실하지 않습니다...

shadcn-ui/ui에서 사용되는 tsup을 찾는 것은 여러 가지 방법으로 도움이 됩니다:

1. tsup을 어떻게 "구현"할 수 있는지 배우게 됩니다.

- OSS에서 찾은 구현은 더 나은 방식으로 문서를 탐색하는 데 도움이 됩니다.

- 전체 문서를 읽는 것은 멋지지만 일부에게는 부담스러울 수 있습니다.

2. shadcn-ui 소스 코드를 읽고 실제로 작동하는 모습을 확인하세요. tsup는 shadcn-ui/ui CLI 소스 코드에서 검색할 때 두 위치에서 발견됩니다:

• 패키지.json

"scripts": {  
 "dev": "tsup - watch",  
 "build": "tsup",

• tsup.config.ts

import { defineConfig } from "tsup"  

export default defineConfig({  
 clean: true,  
 dts: true,  
 entry: \["src/index.ts"\],  
 format: \["esm"\],  
 sourcemap: true,  
 minify: true,  
 target: "esnext",  
 outDir: "dist",  
})

이 시점에서는 이러한 옵션이 무엇인지, 스크립트가 어떻게 구성되어 있는지 알아보기 위해 문서를 읽어보겠습니다.

이렇게 하면 문서에 압도당하는 느낌을 받지 않고 내가 찾고 있는 것이 무엇인지 정확히 알 수 있습니다. 이것이 문서를 가장 많이 읽고 배우기 위한 방향을 설정하는 방법입니다.

이것은 오픈 소스 CLI 관련 패키지에서 TS 라이브러리를 번들로 묶기 위해 처음에 수행한 방법입니다.

shadcn-ui/ui를 처음부터 빌드하는 방법을 배우고 싶으십니까? 확인해 보세요 처음부터 빌드하기

나에 대해:

웹사이트: https://ramunarasinga.com/

링크드인: https://www.linkedin.com/in/ramu-narasinga-189361128/

Github: https://github.com/Ramu-Narasinga

이메일: [email protected]

shadcn-ui/ui를 처음부터 빌드

참고자료:

1. 쩝 문서: https://tsup.egoist.dev/

2. npm: https://www.npmjs.com/package/tsup

3. shadcn-ui/ui의 tsup 사용법: https://github.com/shadcn-ui/ui/blob/main/packages/cli/package.json#L33

4. 내 오픈 소스 CLI 관련 프로젝트: https://github.com/Ramu-Narasinga/TThroo/blob/main/packages/cli/package.json#L35