टाइपस्क्रिप्ट में "* .d.ts" के बारे में


343

मैं उत्सुक *.d.tsहूं क्योंकि मैं टाइपस्क्रिप्ट में नौसिखिया हूं। और मुझे किसी ने बताया था कि इस तरह की फाइल C ++ में "हेड फाइल" की तरह है, लेकिन केवल JS के लिए। लेकिन मैं करने के लिए एक शुद्ध जे एस फ़ाइल परिवर्तित नहीं कर सकते *.d.tsफ़ाइल जब तक कि मैं forcely बदलने *.jsके लिए *.ts। इसलिए मेरे पास तीन फाइलें हैं: एक जेएस फाइल, एक टीएस फाइल और एक *.d.tsफाइल।


  1. उनके बीच क्या संबंध है?

  2. मैं *.d.tsफ़ाइल का उपयोग कैसे कर सकता हूं ? क्या इसका मतलब है कि मैं *.tsफ़ाइल को स्थायी रूप से हटा सकता हूं ?

  3. यदि हां, तो *.d.tsफ़ाइल कैसे जान सकती है कि कौन सी JS फाइल अपने आप में मैप हो रही है?


यह बहुत अच्छा होगा अगर कोई मुझे एक उदाहरण दे सकता है।


जवाबों:


349

"D.ts" फ़ाइल का उपयोग जावास्क्रिप्ट में लिखे गए एपीआई के बारे में टाइपस्क्रिप्ट प्रकार की जानकारी प्रदान करने के लिए किया जाता है। विचार यह है कि आप jQuery या अंडरस्कोर, मौजूदा जावास्क्रिप्ट लाइब्रेरी जैसे कुछ का उपयोग कर रहे हैं। आप अपने टाइपस्क्रिप्ट कोड से उन का उपभोग करना चाहते हैं।

Jquery या अंडरस्कोर या टाइपस्क्रिप्ट में जो कुछ भी लिखना है, उसके बजाय आप d.ts फ़ाइल लिख सकते हैं, जिसमें केवल टाइप एनोटेशन होते हैं। फिर अपने टाइपस्क्रिप्ट कोड से आपको शुद्ध जेएस लाइब्रेरी का उपयोग करते हुए स्थिर प्रकार की जाँच के टाइपस्क्रिप्ट लाभ मिलते हैं।


26
बहुत धन्यवाद! लेकिन jd फ़ाइल में * .d.ts फ़ाइल कैसे मैप करें? Js फ़ाइल को कैसे पता चलता है कि कौन सी d.ts फ़ाइल स्वयं की मैपिंग कर रही है? क्या आप मुझे एक उदाहरण दे सकते हैं?

3
लेकिन d.ts फ़ाइल js फ़ाइल से उत्पन्न होती है, और यदि js फ़ाइल d.ts के बारे में कुछ नहीं जानती है। Js फ़ाइल के बिना अन्य ts फ़ाइलों में d.ts से फ़ंक्शन कैसे कॉल करें? मैं हैरान हूँ ......

8
Stackoverflow.com/questions/18091724/… देखें । आपको उपभोग ts फ़ाइल के शीर्ष पर एक /// <संदर्भ पंक्ति जोड़ने की आवश्यकता है। आपको d.ts और .js फ़ाइल दोनों उपलब्ध कराने की आवश्यकता होगी।
क्रिस टावरेस

3
d.ts फ़ाइल आम तौर पर js फ़ाइल प्रलेखन से हस्तलिखित होती है। लोकप्रिय जावास्क्रिप्ट पुस्तकालयों के लिए इनमें से बड़ी संख्या में उपलब्ध हैं: github.com/borisyankov/DefinitelyTyped
basarat

12
यदि आप अपने प्रोजेक्ट के लिए कस्टम डी बना रहे हैं, तो आप कस्टम d.ts फ़ाइलें कहाँ से लाएँगे?
जय '

77

dघोषणा फ़ाइलों के लिए खड़ा है :

जब टाइपस्क्रिप्ट स्क्रिप्ट संकलित हो जाती है तो एक घोषणा फ़ाइल (एक्सटेंशन .d.ts) के साथ उत्पन्न करने का विकल्प होता है जो संकलित जावास्क्रिप्ट में घटकों के लिए एक अंतरफलक के रूप में कार्य करता है। इस प्रक्रिया में कंपाइलर सभी फंक्शन और मेथड बॉडी को अलग कर देता है और एक्सपोर्ट किए जाने वाले प्रकार के केवल सिग्नेचर को सुरक्षित रखता है। परिणामस्वरूप घोषित फ़ाइल का उपयोग तब किसी जावास्क्रिप्ट लाइब्रेरी या मॉड्यूल के निर्यात किए गए आभासी टाइपस्क्रिप्ट प्रकारों का वर्णन करने के लिए किया जा सकता है जब कोई तृतीय-पक्ष डेवलपर टाइपस्क्रिप्ट से इसका उपभोग करता है।

डिक्लेरेशन फ़ाइलों की अवधारणा C / C ++ में मिली हेडर फ़ाइल की अवधारणा के अनुरूप है।

declare module arithmetics {
    add(left: number, right: number): number;
    subtract(left: number, right: number): number;
    multiply(left: number, right: number): number;
    divide(left: number, right: number): number;
}

प्रकार की घोषणा फ़ाइलों को मौजूदा जावास्क्रिप्ट पुस्तकालयों के लिए हाथ से लिखा जा सकता है, जैसा कि jQuery और Node.js. के लिए किया गया है।

लोकप्रिय जावास्क्रिप्ट पुस्तकालयों के लिए घोषणा फाइलों के बड़े संग्रह निश्चित रूप से टाइप किए गए और टाइपिंग रजिस्ट्री में GitHub पर होस्ट किए गए हैं । एक कमांड-लाइन उपयोगिता जिसे टाइपिंग कहा जाता है, रिपॉजिटरी से घोषणा फ़ाइलों को खोजने और स्थापित करने में मदद करता है।


3
नोट: typingsटाइपस्क्रिप्ट 2.0 के बाद से कमांड लाइन टूल की वास्तव में आवश्यकता नहीं है। अप-टू-डेट दृष्टिकोण @typesनेमस्पेस के तहत एनपीएम रिपॉजिटरी के माध्यम से टाइपिंग रैपर का उपयोग करना है। अधिक जानकारी के लिए github.com/typings/typings/blob/master/README.md
Burt_Harris

1
@takeshin मुझे एक प्रश्न मिला है। क्या मुझे .tsx फ़ाइलों की .d.ts फ़ाइलों को उत्पन्न करने की आवश्यकता है जो केवल मेरे प्रोजेक्ट के अंदर उपयोग की जाती हैं? क्या वे 3 पार्टी पुस्तकालयों को अतिरिक्त जानकारी देने की संभावना के अलावा कुछ और जोड़ रहे हैं?
Krzysztof Trzos

63

मैं टिप्पणी नहीं कर सका और इस तरह एक उत्तर के रूप में जोड़ रहा हूं।
हमें कुछ प्रकार के जावास्क्रिप्ट पुस्तकालय में मौजूदा प्रकारों को मैप करने की कोशिश कर रहा था।

किसी .d.tsफ़ाइल को उसकी जावास्क्रिप्ट फ़ाइल में मैप करने के लिए आपको .d.tsफ़ाइल को उसी तरह की नाम देना होगा जैसे कि जावास्क्रिप्ट फ़ाइल, उन्हें उसी फ़ोल्डर में रखें, और उस कोड को इंगित करें, जिसकी उसे .d.tsफ़ाइल की आवश्यकता है ।

उदाहरण के लिए: test.jsऔर test.d.tsमें हैं testdir/फ़ोल्डर, तो आप एक में इस तरह आयात घटक प्रतिक्रिया:

import * as Test from "./testdir/test";

.d.tsफ़ाइल इस तरह एक नाम स्थान के रूप में निर्यात किया गया था:

export as namespace Test;

export interface TestInterface1{}
export class TestClass1{}

42
किसी ने इस बात का जवाब नहीं दिया कि d.ts को js से कैसे जोड़ा जाए, इसलिए मुझे लगा कि यह सही जगह है।
कांस्टेंटिनम

ध्यान दें कि यदि आप कुछ JS के लिए डिक्लेरेशन फ़ाइल बना रहे हैं जो आपने नहीं बनाई है (उदाहरण के लिए npm से एक पैकेज) तो यह कि .d.tsफ़ाइल को भी आयात किए जाने वाले पैकेज के रूप में नाम दिया जाना चाहिए।
विद्युत्वीर

30

एक विशिष्ट मामले के लिए काम किया उदाहरण :

मान लीजिए कि आपके पास मेरा मॉड्यूल है जिसे आप npm के माध्यम से साझा कर रहे हैं ।

आप इसे स्थापित करें npm install my-module

आप इसे इस प्रकार उपयोग करते हैं:

import * as lol from 'my-module';

const a = lol('abc', 'def');

मॉड्यूल का तर्क सभी में है index.js:

module.exports = function(firstString, secondString) {

  // your code

  return result
}

टाइपिंग जोड़ने के लिए, एक फ़ाइल बनाएँ index.d.ts:

declare module 'my-module' {
  export default function anyName(arg1: string, arg2: string): MyResponse;
}

interface MyResponse {
  something: number;
  anything: number;
}

19

जैसे @takeshin ने कहा .d टाइपस्क्रिप्ट (.ts) के लिए घोषणा फ़ाइल के लिए खड़ा है।

इस पोस्ट का उत्तर देने से पहले कुछ बिंदुओं को स्पष्ट किया जाना चाहिए -

  1. टाइपस्क्रिप्ट जावास्क्रिप्ट का सिंटैक्टिक सुपरसेट है।
  2. टाइपस्क्रिप्ट स्वयं नहीं चलती है, इसे जावास्क्रिप्ट (ट्रांसस्क्रिप्ट को जावास्क्रिप्ट रूपांतरण में टाइप करना ) करना होगा
  3. "टाइप डेफ़िनिशन" और "टाइप चेकिंग" प्रमुख ऐड-ऑन फ़ंक्शनलिटीज़ हैं जो टाइपस्क्रिप्ट जावास्क्रिप्ट पर प्रदान करता है। ( प्रकार स्क्रिप्ट और जावास्क्रिप्ट के बीच अंतर की जाँच करें )

यदि आप सोच रहे हैं कि यदि टाइपस्क्रिप्ट सिर्फ वाक्य-संबंधी सुपरसेट है, तो यह क्या लाभ प्रदान करता है - https://basarat.gitbooks.io/typescript/docs/why-typescript.html#the-typescript-type-system

इस पोस्ट का जवाब देने के लिए -

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

पूर्व के लिए -

यदि आप जावास्क्रिप्ट पुस्तकालय स्थापित करते हैं -

npm install --save mylib

और इसे टाइपस्क्रिप्ट कोड में आयात करने का प्रयास करें -

import * from "mylib";

आपको त्रुटि मिलेगी।

"मॉड्यूल 'mylib' नहीं ढूँढ सकता।"

जैसा कि @ क्रिस द्वारा उल्लेख किया गया है, अंडरस्कोर, जेक्वेरी जैसे कई पुस्तकालय पहले से ही जावास्क्रिप्ट में लिखे गए हैं। टाइपस्क्रिप्ट परियोजनाओं के लिए उन पुस्तकालयों को फिर से लिखने के बजाय, एक वैकल्पिक समाधान की आवश्यकता थी।

ऐसा करने के लिए, आप उपरोक्त। Mylib.d.ts जैसे * .d.ts नाम की जावास्क्रिप्ट लाइब्रेरी में टाइप डिक्लेरेशन फ़ाइल प्रदान कर सकते हैं। घोषणा फ़ाइल केवल संबंधित जावास्क्रिप्ट फ़ाइल में परिभाषित कार्यों और चर के प्रकार की घोषणाएं प्रदान करती है।

अब जब आप कोशिश करेंगे -

import * from "mylib";

mylib.d.ts आयातित हो जाती है जो जावास्क्रिप्ट लाइब्रेरी कोड और टाइपस्क्रिप्ट प्रोजेक्ट के बीच एक इंटरफेस के रूप में कार्य करता है।


3

यह उत्तर मानता है कि आपके पास कुछ जावास्क्रिप्ट हैं जिन्हें आप टाइपस्क्रिप्ट में बदलना नहीं चाहते हैं, लेकिन आप अपने लिए न्यूनतम परिवर्तनों के साथ टाइप चेकिंग से लाभ उठाना चाहते हैं .js। एक .d.tsफ़ाइल बहुत सी या सी ++ हेडर फ़ाइल की तरह है। इसका उद्देश्य एक इंटरफ़ेस को परिभाषित करना है। यहाँ एक उदाहरण है:

mashString.d.ts

/** Makes a string harder to read. */
declare function mashString(
    /** The string to obscure */
    str: string
):string;
export = mashString;

mashString.js

// @ts-check
/** @type {import("./mashString")} */
module.exports = (str) => [...str].reverse().join("");

main.js

// @ts-check
const mashString = require("./mashString");
console.log(mashString("12345"));

यहाँ संबंध है: mashString.d.tsएक इंटरफ़ेस को परिभाषित करता है, इंटरफ़ेस को mashString.jsलागू करता है और इंटरफ़ेस का main.jsउपयोग करता है।

// @ts-check अपनी .jsफ़ाइलों में जोड़ने के लिए काम करने के लिए जाँच करने के लिए टाइप करें। लेकिन यह केवल जाँचता है कि main.jsइंटरफ़ेस का सही उपयोग करता है। यह भी सुनिश्चित करने के लिए कि mashString.jsहम /** @type {import("./mashString")} */निर्यात से पहले इसे सही ढंग से लागू करते हैं ।

टाइपिंग चेकिंग और डॉक्यूमेंटेशन को बेहतर बनाने के लिए आप अपनी प्रारंभिक .d.tsफ़ाइलों का उपयोग करके बना सकते हैं tsc -allowJs main.js -d

ज्यादातर मामलों में कार्यान्वयन और इंटरफ़ेस का एक ही नाम है, यहाँ mashString। लेकिन आपके पास वैकल्पिक कार्यान्वयन हो सकते हैं। उदाहरण के लिए हम नाम बदलने सकता है mashString.jsकरने के लिए reverse.jsऔर एक वैकल्पिक है encryptString.js

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.