एकाधिक एएमडी फाइलों में मॉड्यूल कैसे फैलाएं?

Question

मुझे यह पता नहीं लगाया जा सकता है कि कई फाइलों में "निर्यात मॉड्यूल" फैलाना संभव है या नहीं।

अगर मैं फ़ाइल Contact.ts है:

// file Contact.ts 
export module Contacts { 
    export class Contact { 
     ... 
    } 
} 

और एक अन्य ContactView.ts

// file ContactView.ts 
export module Contacts { 
    export class ContactView { 
     model: Contact; // <--- is not recognized 
    } 
} 

फिर टीएससी संपर्क वर्ग पहचान नहीं कर रहा। जैसा कि आप देख सकते हैं संपर्क और संपर्क दृश्य को उसी मॉड्यूल में रहने के लिए घोषित किया गया है और spec के अनुसार इसे काम करना चाहिए।

मैं require.js और एएमडी पैटर्न का उपयोग करता है तो मैं "निर्यात मॉड्यूल" घोषणा उपयोग करने के लिए एक समग्र एप्लिकेशन बनाने रहा हूँ।

क्या मुझे कुछ प्रकार की "आगे की घोषणा" या कुछ मुश्किल "आयात" करना चाहिए?

सलाह के लिए धन्यवाद।

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

Answer 1

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

आप ContactView.ts मॉड्यूल के अंदर Contact.ts मॉड्यूल लोड करने के लिए निम्न कोड लिख सकते हैं:

// file ContactView.ts  
import mod = module("./Contact"); 

export module Contacts { 
    export class ContactView { 
     model: mod.Contacts.Contact; // <--- will be recognized 
    } 
} 

और वह काफी अच्छी तरह से काम करना चाहिए, लेकिन अगर आप की सामग्री के लिए उपयोग करना चाहते थे

import c = module("./Contact"); 
import cv = module("./ContactView"); 

कौन सा मुझे लगता है, काफी ठीक है क्योंकि आप स्पष्ट रूप से अपनी निर्भरता बताते हुए कर रहे हैं: अनिवार्य रूप से उन दोनों को आयात करने के लिए एक अन्य क्षेत्र में दोनों मॉड्यूल (उदाहरण अपने आप को एक नया संपर्क मॉडल बनाने के लिए करने के लिए), तो आपको करना होगा। नकारात्मकता यह है कि वे एक सामान्य पैरेंट ऑब्जेक्ट साझा नहीं करेंगे, इसलिए उन्हें दोनों "संपर्क" मॉड्यूल-पैटर्न में होना संभवतः बहुत अच्छा उपयोग नहीं है।

एक और विकल्प "संपर्क" के साथ "संपर्क" निर्यात करना है, जैसा कि निम्नानुसार है (यह कोड मूर्खतापूर्ण है क्योंकि आप पहले से ही संपर्क दृश्य की मॉडल प्रॉपर्टी के माध्यम से कर रहे हैं, लेकिन कम कभी नहीं ...):

export module Contacts { 
    export class ContactView { 
     model: mod.Contacts.Contact; 
     constructor() { 
      this.model = new mod.Contacts.Contact(); 
     } 
    } 

    export var Contact = mod.Contacts.Contact; 
} 

तो आप संपर्क दृश्य लोड करने के बाद इसे एक्सेस करने में सक्षम होंगे।

संपादित करें: वैसे, आप के माध्यम से "निर्यात मॉड्यूल नाम {...}" केवल निर्यात मॉड्यूल तक सीमित नहीं हैं, तो आप फ़ाइल ही मॉड्यूल है के रूप में कुछ भी निर्यात कर सकते हैं। तो आपके पास एक फ़ाइल हो सकती है जिसमें "निर्यात फ़ंक्शन foo() {...}" बिना किसी मॉड्यूल-पैटर्न कोड को लपेटे।

EDIT2: ऐसा लगता है कि एएमडी में कई निर्भरताओं को लोड करने और उनसे "मॉड्यूल" बनाने के लिए कार्यक्षमता हो सकती है, लेकिन मुझे नहीं पता कि यह टीएस में कैसे काम करेगा, यहां एक लिंक है जो उस पर जाता है: http://www.adobe.com/devnet/html5/articles/javascript-architecture-requirejs-dependency-management.html (कन्स्ट्रक्टर मॉड्यूल) ।

Answer 2

मैं थोड़ी देर के लिए एक ही प्रश्न के साथ संघर्ष कर रहा था, और सिर्फ इस सवाल पर भटकने के मामले में मैं जो कुछ भी कर रहा हूं उसे साझा करना चाहता था।

सबसे पहले, मैं अपने आप को एक संदर्भ फ़ाइल है कि मेरे मॉड्यूल में फ़ाइलों के सभी वाणी परिभाषित:

/// <reference path="_contacts.dependencies.ts" /> 
/// <reference path="../contacts/Contact.ts" /> 
/// <reference path="../contacts/ContactView.ts" /> 
/// <reference path="../contacts/ContactModel.ts" /> 

ध्यान दें कि फाइल के अंदर निर्दिष्ट पथ संदर्भ फ़ाइल ही (_contacts.ts) के स्थान के सापेक्ष हैं, .js संदर्भ फ़ाइल के विपरीत। मेरी निर्देशिका संरचना इस तरह दिखती है:

modules 
    references // all of the reference files 
     knockout 
     underscore 
     // ... a subfolder for every 3rd party library used 
    contacts 
    commerce 
    // ... other modules at same level as contacts 

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

हर फ़ाइल कि मॉड्यूल का हिस्सा है अंदर, मैं ऊपर फ़ाइल संदर्भ:

/// <reference path="../references/_contacts.ts" /> 
module Contacts { 
    export class Contact { 
     public model: ContactModel; 
     // ... 
    } 
} 

इसी तरह, आप अपने सभी मॉड्यूल सूची एक भी संदर्भ फ़ाइल बना सकते हैं:

/// <reference path="_address.ts" /> 
/// <reference path="_contacts.ts" /> 
/// <reference path="_commerce.ts" /> 

और बस इसे अपनी स्रोत फ़ाइलों से इंगित करें।

यह अलग फ़ाइलों में उत्सर्जित कोड की समस्या को हल नहीं करता है, हालांकि। उस समस्या के लिए मैं एक जावास्क्रिप्ट खनन उपकरण का उपयोग कर रहा हूं, जो एक ही स्रोत फ़ाइल में एकाधिक फ़ाइलों को बंडल करने में सक्षम है। आपकी संकलन सेटिंग्स और केस की ज़रूरतों के आधार पर, आपको एएमडी मॉड्यूल के रूप में काम करने के लिए जेनरेट कोड के चारों ओर कुछ रैपर लागू करने की आवश्यकता हो सकती है (अभी तक उस हिस्से से बहुत परिचित नहीं है)।