टाइपस्क्रिप्ट - प्रकार बनाम "घोषित var" टाइप परिभाषाओं के साथ

Question

टाइपस्क्रिप्ट का उपयोग करके एक कोणीय 2 ऐप बनाना, मैं लोकप्रिय d3 लाइब्रेरी आयात करने का प्रयास कर रहा हूं।

मैं TSD का उपयोग कर प्रकार परिभाषाएं स्थापित किया है, और मैं tsd.d.ts फ़ाइल ठीक से संदर्भित कर रहा हूँ:

/// <reference path="../../../tools/typings/tsd/tsd.d.ts" />

अब, मैं अपने d3 node_module import करना चाहते हैं। यह NPM के माध्यम से स्थापित किया गया था:

/// <reference path="../../../tools/typings/tsd/tsd.d.ts" /> 
import * as d3 from 'd3/d3'; 

यह काम करता है, लेकिन मैं अपने प्रकार परिभाषाएं से कोई लाभ नहीं मिलता है। मेरा आईडीई किसी भी प्रकार की अगली जानकारी या सिंटैक्स हाइलाइटिंग प्रदान नहीं कर रहा है। यदि मैं यह करने के लिए बदल:

/// <reference path="../../../tools/typings/tsd/tsd.d.ts" /> 
import * as d3 from 'd3/d3'; 

मैं अब वाक्य रचना हाइलाइटिंग/टाइप-आगे परिभाषाओं कि मैं उम्मीद कर रहा हूँ के सभी मिलता है। हालांकि, मेरा ऐप node_modules/d3.js पर एक फ़ाइल की तलाश में है जो अस्तित्व में नहीं है, इसलिए यह स्पष्ट रूप से काम नहीं करता है।

जब मैं एक var घोषणा करने के लिए अपने आयात बयान बदलने के लिए, मेरे ऐप सही ढंग से संकलित और मैं सभी उचित टाइपप्रति परिभाषाएं प्राप्त:

/// <reference path="../../../tools/typings/tsd/tsd.d.ts" /> 
declare var d3 = require('d3/d3'); 

तो, मेरे सवाल का बस सही दृष्टिकोण क्या है? import बनाम declare var में अंतर क्या है, और import का उपयोग करते समय टाइप परिभाषाएं प्राप्त करने का कोई तरीका है यदि वे स्वयं एनपीएम मॉड्यूल में शामिल नहीं हैं?

मैंने देखा है कि import {Component} from 'angular2/core'; जैसी चीजें ठीक काम करती हैं, लेकिन टाइप परिभाषाएं उसी निर्देशिका में शामिल की जाती हैं जैसे जावास्क्रिप्ट फ़ाइल मैं आयात कर रहा हूं।

Answer 1

import * as d3 from 'd3/d3'; टाइप सिस्टम के साथ ठीक काम करना चाहिए (///<reference .../> के बिना) जब तक संकलक विकल्प सही होते हैं, और फ़ोल्डर संरचना टाइपिंग फ़ोल्डर में सही होती है।

declare var d3 जेएस में कहीं भी मौजूद एक चर घोषित करने का तरीका है। इसके बारे में सोचें "हाँ, हाँ टाइपस्क्रिप्ट, शिकायत छोड़ना, मेरा विश्वास करो यह मौजूद है"।

import {Component} from 'angular2/core'; मॉड्यूल से एक विशिष्ट टुकड़ा खींचने का तरीका है। नोड शब्दों में यह var Component = require('angular2/core').Component;

पर लागू होने वाला महत्वपूर्ण कंपाइलर विकल्प "moduleResolution": "node" है, जो पहले से ही कोणीय 2 कार्य करने के लिए होना चाहिए।

तो अगर d3 एक node_module के रूप में स्थापित किया गया था तो आप में सक्षम बस का उपयोग करने के होना चाहिए:

npm install d3 
tsd install d3 
tsc 

और यह सिर्फ काम करना चाहिए।

यदि आपने बॉवर का उपयोग करके डी 3 स्थापित किया है, तो आपको इसके बजाय मॉड्यूल के सापेक्ष पथ का उपयोग करने की आवश्यकता होगी।

bower install d3 
tsd install d3 

तो

/// <reference path="../path/to/typings/d3/d3.d.ts" /> 
import * as d3 from '../path/to/d3';