Jak se šíří modul na několik souborů AMD?

Question

Jak se šíří modul na několik souborů AMD?

hlasů

8

Nemůžu přijít na to, jestli to vůbec možné mít „exportní modul“ rozprostřeného naproti přes více souborů.

Mám-li Contact.ts souboru:

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

a dalších ContactView.ts

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

Pak TSC není rozpoznání kontaktní výuky ve třídě. Jak můžete vidět Contact a ContactView jsou deklarovány pobývat ve stejném modulu a podle specifikace by to mělo fungovat.

Stavím kompozitní aplikace, který používá require.js a vzory AMD, takže musím použít „export modul“ prohlášení.

Měl bych udělat nějaký druh „dopředu prohlášení“ nebo nějaké choulostivé „dovozem“?

Díky za poradit.

EDIT: V současné době jsem nahrát každý modul zvlášť prostřednictvím dovozu, ale pokud si všimnete, že vytváří obrovské plýtvání kódu a hodně „importované“ závislostí. Moje otázka byla, jestli existuje způsob, jak používat stejný obor názvů (tj Kontakty), aby vědět, TS, že nemám v úmyslu importovat. Díval jsem se do normálního příkazu //, ale to nefunguje. Dokonce jsem se snažil * .d.ts deklarace soubory bez úspěchu doposud.

typescript

Položena 08/10/2012 v 23:18
zdroj uživatelem IgorM

V jiných jazycích...

2 odpovědí

nxn · Answer 1 · 2012-10-09 02:21

Spec umožňuje definovat interní moduly na více souborů (v podstatě interní moduly naleznete v javascriptu modulu vzoru). Externí moduly, jako například AMD nebo CommonJS moduly, práce na myšlence, že každý soubor je skutečný „modul kódu“, a jmenného prostoru / pojmenování v něm je irelevantní, protože modul bude načten do vlastního nového objektu stejně.

Dalo by se napsat následující kód načíst modul Contact.ts uvnitř modulu ContactView.ts:

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

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

A to by mělo fungovat docela dobře, ale pokud byste chtěli mít přístup k obsahu obou modulů v jiné oblasti (aby se například vytvořit nový kontakt, model sami), museli byste v podstatě dovážet oba:

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

Což myslím, že je v pořádku dost, protože jste jasně formulovat své závislosti. Nevýhodou je, že oni zvyklý sdílejí společný nadřazený objekt, takže s nimi být jak v „Contact“ modulu vzor pravděpodobně není velmi užitečné.

Další možností je export „Kontakt“ spolu s „ContactView“, takto (udělil tento kód je trochu hloupé, protože jste již dělá přesně to prostřednictvím modelu majetku ContactView, ale nikdy méně ...):

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

    export var Contact = mod.Contacts.Contact;
}

Takže byste být schopni se k nim dostat po načtení ContactView.

EDIT: Mimochodem, nejste omezeni pouze na vyvážejících modulů pomocí „Jméno export modulu {...}“, můžete exportovat něco jako soubor samotný je modul. Takže můžete mít soubor, který má pouze „export funkci foo () {...}“ bez jakéhokoliv modulu vzor kódu zabalením.

EDIT2: Vypadá to, že AMD může mít funkce pro načítání více závislostí a budovat „moduly“ od těch, ale nemám ponětí, jak to bude fungovat v TS, tady je odkaz, který přejde, že: http://www.adobe.com /devnet/html5/articles/javascript-architecture-requirejs-dependency-management.html (konstruktoru moduly).

Morten Mertner · Answer 2 · 2012-12-13 00:12

Snažil jsem se stejnou otázkou na chvíli a jen chtěl podělit, co dělám v případě, že někdo jiný putuje přes tuto otázku.

Za prvé, je definován jsem si referenční soubor, který deklaruje všechny soubory v mém modulu:

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

Všimněte si, že dráhy určené uvnitř souboru je relativní k umístění referenčního souboru samotného ( _contacts.ts), na rozdíl od .jsreferenčního souboru. Můj adresářová struktura vypadá takto:

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

Zpět na reference samotný soubor. První řádek obsahuje samostatný referenční soubor se seznamem všech externích knihoven používaných modulem, jako například podtržení, moment nebo jakékoliv jiné existující knihovny, kterou mají .d.tsdefiničního souboru pro. Zbývající řádky jsou soubory, které tvoří modul.

Uvnitř každého souboru, který je součástí modulu, já odkaz na výše uvedený soubor:

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

Stejně tak si můžete vytvořit jednotný referenční soubor, který chcete vypsat všechny moduly:

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

A jednoduše poukazují na to ze zdrojových souborů.

Tato neřeší problém emitovaného kódem, který v samostatných souborech, ačkoli. Z tohoto problému jsem pomocí JavaScriptu Minification nástroj, který je schopen svazování do více souborů do jednoho zdrojového souboru. V závislosti na nastavení kompilace a use case potřeb, možná budete muset použít nějaký obal kolem generovaného kódu pro to, aby pracovat jako modul AMD (ne příliš obeznámen s tou částí zatím).