TypeScript में .d.ts इंटरफ़ेस प्रॉपर्टी टाइप कैसे बदलें: पूरी गाइड

शुरुआती लोगों के लिए ऑनलाइन Python प्रशिक्षक

Python आसानी से सीखें बिना सिद्धांत के बोझ के। स्वचालित जांच के साथ व्यावहारिक कार्य हल करें और ब्राउज़र में सीधे कोड लिखें।

पाठ्यक्रम शुरू करें

परिचय: आप सीधे टाइप क्यों नहीं बदल सकते?

\n\n

एक स्थिति की कल्पना करें: आप चार्ट बनाने के लिए एक शक्तिशाली लाइब्रेरी का उपयोग कर रहे हैं। इसका डॉक्यूमेंटेशन शानदार है, GitHub पर सैकड़ों स्टार हैं, और .d.ts फ़ाइलें भी टाइप विवरण के साथ आती हैं। लेकिन एक समस्या है — लाइब्रेरी के डेवलपर ने तय किया कि data फ़ील्ड string | number होनी चाहिए, जबकि आपको सख्ती से Date चाहिए। आप node_modules में जाकर फ़ाइल बदलते हैं — और अगली npm install पर सब कुछ टूट जाता है।

\n\n

परिचित लग रहा है? यह TypeScript डेवलपर्स की सबसे आम समस्याओं में से एक है। "Overriding interface property type defined in Typescript d.ts file" सवाल ने Stack Overflow पर हज़ारों व्यूज़ बटोरे हैं। और यह सही भी है — असली मुश्किल बारीकियों में छिपी है।

\n\n

इस लेख में हम बाहरी .d.ts फ़ाइल से इंटरफ़ेस प्रॉपर्टी टाइप बदलने के 5 कानूनी तरीके समझेंगे। फ़ाइल कॉपी करने जैसे कोई हैक नहीं — सिर्फ शुद्ध TypeScript।

\n\n

समस्या को समझना: TypeScript क्यों विरोध करता है?

\n\n

सिस्टम को तोड़ने से पहले, इसकी लॉजिक समझ लें। TypeScript टाइप्स में सख्ती सिर्फ आपकी सुरक्षा के लिए है। जब आप किसी इंटरफ़ेस की प्रॉपर्टी बदलने की कोशिश करते हैं, तो आप कह रहे होते हैं: "मैं लाइब्रेरी के लेखक से बेहतर जानता हूं"। और TypeScript पूछता है: "पक्का? साबित करो"।

\n\n

एक क्लासिक उदाहरण देखें। मान लीजिए, लाइब्रेरी से यह इंटरफ़ेस है:

\n\n
// node_modules/some-library/types.d.ts\nexport interface UserConfig {\n  id: string | number;\n  name: string;\n  createdAt: Date | string;\n  metadata: Record<string, unknown>;\n}
\n\n

आप चाहते हैं कि createdAt सिर्फ Date हो। साधारण इनहेरिटेंस काम नहीं करेगा — TypeScript एरर देगा अगर आप टाइप को संकीर्ण करने की कोशिश करेंगे। लेकिन कुछ रास्ते हैं।

\n\n

तरीका 1: Declaration Merging (घोषणाओं का विलय)

\n\n

सबसे सुंदर तरीका, जब संभव हो। अगर लाइब्रेरी इंटरफ़ेस (न कि type) एक्सपोर्ट करती है, तो आप इसे ग्लोबल स्कोप या मॉड्यूल में "पूरक" कर सकते हैं।

\n\n

महत्वपूर्ण शर्त: एक ही स्कोप में समान नाम वाले इंटरफ़ेस स्वचालित रूप से विलय हो जाते हैं। लेकिन मौजूदा प्रॉपर्टी को बदला नहीं जा सकता — सिर्फ नई जोड़ी जा सकती है।

\n\n

इसलिए यह तरीका तब उपयुक्त है जब आपको इंटरफ़ेस को विस्तारित करना हो, न कि मौजूदा फ़ील्ड बदलनी हो। उदाहरण:

\n\n
// global.d.ts\nexport interface UserConfig {\n  customField: boolean; // ✅ नया फ़ील्ड जोड़ना\n}\n\n// लेकिन ऐसा करने पर एरर:\nexport interface UserConfig {\n  createdAt: Date; // ❌ एरर: आइडेंटिफ़ायर का डुप्लिकेशन\n}
\n\n

निष्कर्ष: Declaration Merging फ़ील्ड जोड़ने के लिए बेहतरीन है, लेकिन मौजूदा प्रॉपर्टी बदलने के लिए बेकार।

\n\n

तरीका 2: Omit और अपने इंटरफ़ेस का उपयोग

\n\n

यह 90% मामलों के लिए सबसे कारगर तरीका है। सीधा सा: हम Omit के ज़रिए समस्या वाली प्रॉपर्टी को "काट" देते हैं और सही टाइप के साथ नया टाइप बनाते हैं।

\n\n
// आपका कोड\ntype MyUserConfig = Omit<UserConfig, 'createdAt'> & {\n  createdAt: Date; // ✅ अब सिर्फ Date\n};\n\n// उपयोग\nconst config: MyUserConfig = {\n  id: 42,\n  name: 'Alice',\n  createdAt: new Date('2024-01-01'), // काम करता है\n  metadata: { role: 'admin' }\n};
\n\n

यहां क्या हो रहा है? Omit<UserConfig, 'createdAt'> createdAt फ़ील्ड के बिना एक टाइप बनाता है। फिर टाइप इंटरसेक्शन (&) के ज़रिए हम इस फ़ील्ड को सही टाइप के साथ वापस जोड़ते हैं।

\n\n

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

\n\n

तरीका 3: Pick और Partial के ज़रिए विस्तार

\n\n

कभी-कभी एक नहीं, बल्कि कई प्रॉपर्टी बदलनी होती हैं। या आप सभी फ़ील्ड को वैकल्पिक बनाना चाहते हैं।

ब्लॉग

पुस्तक अनुशंसाएँ