W przypadku korzystania z wtyczki TypeScript do usługi vs.net, jak utworzyć jeden moduł importu pliku TypeScript zadeklarowany w innych plikach TypeScript?

plik 1:

module moo
{
    export class foo .....
}

plik 2:

//what goes here?

class bar extends moo.foo
{
}

Od wersji TypeScript 1.8 możesz używać prostych importinstrukcji, tak jak w ES6:

import { ZipCodeValidator } from "./ZipCodeValidator";

let myValidator = new ZipCodeValidator();

https://www.typescriptlang.org/docs/handbook/modules.html

Stara odpowiedź: Od wersji 1.5 TypeScript możesz użyć tsconfig.json: http://www.typescriptlang.org/docs/handbook/tsconfig-json.html

Całkowicie eliminuje potrzebę odwoływania się do stylu komentarza.

Starsza odpowiedź:

Musisz odwołać się do pliku w górnej części bieżącego pliku.

Możesz to zrobić w ten sposób:

/// <reference path="../typings/jquery.d.ts"/>
/// <reference path="components/someclass.ts"/>

class Foo { }

itp.

Te ścieżki są względne w stosunku do bieżącego pliku.

Twój przykład:

/// <reference path="moo.ts"/>

class bar extends moo.foo
{
}

Maszynopis rozróżnia dwa różne rodzaje modułów: Moduły wewnętrzne służą do wewnętrznej strukturyzacji kodu. W czasie kompilacji musisz wprowadzić wewnętrzne moduły do ​​zakresu za pomocą ścieżek referencyjnych:

/// <reference path='moo.ts'/>

class bar extends moo.foo {
}

Z drugiej strony, moduły zewnętrzne służą do odwoływania się do zewnętrznych plików źródłowych, które mają być ładowane w czasie wykonywania przy użyciu CommonJS lub AMD . W Twoim przypadku, aby skorzystać z ładowania modułu zewnętrznego, musisz wykonać następujące czynności:

moo.ts

export class foo {
    test: number;
} 

app.ts

import moo = module('moo');
class bar extends moo.foo {
  test2: number;
}

Zwróć uwagę na inny sposób uwzględnienia kodu w zakresie. W przypadku modułów zewnętrznych należy używać modulenazwy pliku źródłowego zawierającego definicję modułu. Jeśli chcesz używać modułów AMD, musisz wywołać kompilator w następujący sposób:

tsc --module amd app.ts

To jest następnie kompilowane do

var __extends = this.__extends || function (d, b) {
    function __() { this.constructor = d; }
    __.prototype = b.prototype;
    d.prototype = new __();
}
define(["require", "exports", 'moo'], function(require, exports, __moo__) {
    var moo = __moo__;

    var bar = (function (_super) {
        __extends(bar, _super);
        function bar() {
            _super.apply(this, arguments);

        }
        return bar;
    })(moo.foo);
})    

Jeśli używasz modułów AMD, inne odpowiedzi nie będą działać w TypeScript 1.0 (najnowszym w momencie pisania).

Masz do wyboru różne podejścia, w zależności od tego, ile rzeczy chcesz wyeksportować z każdego .tspliku.

Wielokrotny eksport

Foo.ts

export class Foo {}
export interface IFoo {}

Bar.ts

import fooModule = require("Foo");

var foo1 = new fooModule.Foo();
var foo2: fooModule.IFoo = {};

Pojedynczy eksport

Foo.ts

class Foo
{}

export = Foo;

Bar.ts

import Foo = require("Foo");

var foo = new Foo();

Jeśli chcesz używać modułów i chcesz, aby kompilowały się do pojedynczego pliku JavaScript, możesz wykonać następujące czynności:

tsc -out _compiled/main.js Main.ts

Main.ts

///<reference path='AnotherNamespace/ClassOne.ts'/>
///<reference path='AnotherNamespace/ClassTwo.ts'/>

module MyNamespace
{
    import ClassOne = AnotherNamespace.ClassOne;
    import ClassTwo = AnotherNamespace.ClassTwo;

    export class Main
    {
        private _classOne:ClassOne;
        private _classTwo:ClassTwo;

        constructor()
        {
            this._classOne = new ClassOne();
            this._classTwo = new ClassTwo();
        }
    }
}

ClassOne.ts

///<reference path='CommonComponent.ts'/>

module AnotherNamespace
{
    export class ClassOne
    {
        private _component:CommonComponent;

        constructor()
        {
            this._component = new CommonComponent();
        }
    }
}

CommonComponent.ts

module AnotherNamespace
{
    export class CommonComponent
    {
        constructor()
        {
        }
    }
}

Możesz przeczytać więcej tutaj: http://www.codebelt.com/typescript/javascript-namespacing-with-typescript-internal-modules/

Unikałbym teraz używania, /// <reference path='moo.ts'/>ale dla bibliotek zewnętrznych, w których plik definicji nie jest zawarty w pakiecie.

W reference pathrozwiązuje błędy w edytorze, ale tak naprawdę nie oznacza potrzeby importowanego pliku. Dlatego jeśli używasz przepływu pracy gulp lub JSPM, mogą one próbować skompilować osobno każdy plik zamiasttsc -out jednego pliku.

Z maszynopisu 1.5

Po prostu wpisz przedrostek, który chcesz wyeksportować na poziomie pliku (zakres główny)

aLib.ts

{
export class AClass(){} // exported i.e. will be available for import
export valueZero = 0; // will be available for import
}

Możesz także dodać później na końcu pliku to, co chcesz wyeksportować

{
class AClass(){} // not exported yet
valueZero = 0; // not exported yet
valueOne = 1; // not exported (and will not in this example)

export {AClass, valueZero} // pick the one you want to export
}

Lub nawet połącz oba razem

{
class AClass(){} // not exported yet
export valueZero = 0; // will be available for import
export {AClass} // add AClass to the export list
}

W przypadku importu masz 2 opcje, najpierw wybierasz ponownie to, co chcesz (jedna po drugiej)

anotherFile.ts

{
import {AClass} from "./aLib.ts"; // you import only AClass
var test = new AClass();
}

Albo cały eksport

{
import * as lib from "./aLib.ts"; // you import all the exported values within a "lib" object
var test = new lib.AClass();
}

Uwaga dotycząca eksportu: eksport dwukrotnie tej samej wartości spowoduje błąd {export valueZero = 0; eksportuj {valueZero}; // wartość valueZero została już wyeksportowana…}

Od TypeScript 1.8+możesz użyć prostej prostej importinstrukcji, takiej jak:

import { ClassName } from '../relative/path/to/file';

lub wersja wieloznaczna:

import * as YourName from 'global-or-relative';

Czytaj więcej: https://www.typescriptlang.org/docs/handbook/modules.html

wykorzystał odniesienie, takie jak, "///<reference path="web.ts" /> a następnie we właściwościach projektu VS2013 do tworzenia „app.ts”, „Typescript Build” -> „Połącz wyjście javascript w plik:„ (zaznaczone) -> „app.js”

import {className} from 'filePath';

pamiętaj też. Klasa, którą importujesz, która musi zostać wyeksportowana w pliku .ts.

Szybki łatwy proces w programie Visual Studio

Przeciągnij i upuść plik z rozszerzeniem .ts z okna rozwiązania do edytora, wygeneruje on wbudowany kod referencyjny, taki jak ...

/// <reference path="../../components/someclass.ts"/>