मोनोरेपो सेटअप में टाइपस्क्रिप्ट का उपयोग कैसे करें

मोनोरेपो सेटअप आपको एक ही रिपॉजिटरी में कई पैकेज या प्रोजेक्ट प्रबंधित करने की अनुमति देता है। टाइपस्क्रिप्ट के साथ, यह सेटअप अलग-अलग पैकेज में टाइप, इंटरफेस और यहां तक ​​कि उपयोगिताओं को साझा करने के लिए विशेष रूप से शक्तिशाली है। यह गाइड आपको मोनोरेपो वातावरण में टाइपस्क्रिप्ट को सेट करने के तरीके के बारे में बताएगा।

1. मोनोरेपो की स्थापना

मोनोरेपो सेट अप करने के लिए, आप npm वर्कस्पेस या yarn वर्कस्पेस जैसे टूल का उपयोग कर सकते हैं। ये टूल आपको एक ही रिपॉजिटरी में कई पैकेज प्रबंधित करने की अनुमति देते हैं और प्रोजेक्ट में कोड साझा करना आसान बनाते हैं।

1.1 मोनोरिपो आरंभ करना

सबसे पहले, अपने मोनोरेपो के लिए एक नया फ़ोल्डर बनाएं और इसे npm या yarn से आरंभ करें।

mkdir my-monorepo
cd my-monorepo
npm init -y

फिर, अपने package.json में कार्यस्थान कॉन्फ़िगर करें:

{
  "name": "my-monorepo",
  "version": "1.0.0",
  "private": true,
  "workspaces": [
    "packages/*"
  ]
}

यह सेटअप npm या यार्न को बताता है कि सभी पैकेज packages फ़ोल्डर के अंदर रहेंगे।

2. मोनोरेपो में पैकेज जोड़ना

अपने मोनोरेपो में दो पैकेज बनाएँ। इस उदाहरण के लिए, हम पुनः प्रयोज्य कोड के लिए shared पैकेज और फ्रंटएंड एप्लिकेशन के लिए web-app पैकेज बनाएंगे।

mkdir -p packages/shared
mkdir -p packages/web-app

प्रत्येक पैकेज के अंदर, package.json आरंभ करें:

cd packages/shared
npm init -y

cd ../web-app
npm init -y

3. मोनोरेपो में टाइपस्क्रिप्ट जोड़ना

इसके बाद, हम TypeScript सेट अप करेंगे। अपने मोनोरेपो के रूट पर TypeScript और आवश्यक निर्भरताएँ स्थापित करें:

npm install typescript --save-dev

संपूर्ण मोनोरेपो के लिए टाइपस्क्रिप्ट कॉन्फ़िगरेशन को परिभाषित करने के लिए रूट-स्तर tsconfig.json बनाएं:

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "*": ["packages/*/src"]
    },
    "composite": true,
    "declaration": true,
    "outDir": "dist",
    "rootDir": ".",
    "skipLibCheck": true,
    "module": "ESNext",
    "target": "ES6",
    "moduleResolution": "node"
  },
  "include": ["packages/*"]
}

यहां कुंजी paths विकल्प है, जो टाइपस्क्रिप्ट को मोनोरेपो में विभिन्न पैकेजों से आयात को समझने की अनुमति देता है।

4. प्रत्येक पैकेज में टाइपस्क्रिप्ट को कॉन्फ़िगर करना

मोनोरेपो में ठीक से काम करने के लिए प्रत्येक पैकेज को अपने स्वयं के tsconfig.json की आवश्यकता होती है। यहाँ shared पैकेज के लिए एक उदाहरण कॉन्फ़िगरेशन दिया गया है:

{
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "rootDir": "src",
    "outDir": "dist"
  },
  "include": ["src"]
}

और web-app पैकेज के लिए:

{
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "rootDir": "src",
    "outDir": "dist"
  },
  "include": ["src"]
}

अब, टाइपस्क्रिप्ट का उपयोग प्रत्येक पैकेज में किया जा सकता है, और कॉन्फ़िगरेशन रूट tsconfig.json से साझा किए जाते हैं।

5. पैकेज में टाइपस्क्रिप्ट कोड जोड़ना

आइए दोनों पैकेजों में कुछ नमूना TypeScript कोड जोड़ें। shared पैकेज में, एक src फ़ोल्डर बनाएँ और एक TypeScript फ़ाइल जोड़ें:

mkdir -p packages/shared/src
touch packages/shared/src/index.ts

index.ts में, एक सरल फ़ंक्शन निर्यात करें:

export const greet = (name: string): string => {
  return `Hello, ${name}!`;
}

web-app पैकेज में, एक src फ़ोल्डर और एक index.ts फ़ाइल बनाएँ:

mkdir -p packages/web-app/src
touch packages/web-app/src/index.ts

अब, साझा फ़ंक्शन आयात करें:

import { greet } from 'shared';

console.log(greet('TypeScript Monorepo'));

6. मोनोरेपो का निर्माण

मोनोरेपो में सभी टाइपस्क्रिप्ट कोड को संकलित करने के लिए, हमें टाइपस्क्रिप्ट कंपाइलर का उपयोग करना होगा। मोनोरेपो के रूट पर, चलाएँ:

npx tsc --build

यह कमांड सभी पैकेजों को उनकी संबंधित tsconfig.json फाइलों का अनुसरण करके संकलित करेगा।

निष्कर्ष

इस गाइड में, हमने बताया कि मोनोरेपो में टाइपस्क्रिप्ट को कैसे सेट अप और इस्तेमाल किया जाए। अपने कोड को मोनोरेपो संरचना में व्यवस्थित करके, आप आसानी से कई पैकेजों में कोड साझा कर सकते हैं, जिससे आपकी विकास प्रक्रिया अधिक कुशल बन जाती है। टाइपस्क्रिप्ट की मजबूत टाइपिंग और प्रोजेक्ट संदर्भों के साथ, यह सेटअप बड़े पैमाने के अनुप्रयोगों या साझा लाइब्रेरी के लिए एकदम सही है।