Lors de l'utilisation du plug-in TypeScript pour vs.net, comment créer un module d'importation de fichier TypeScript déclaré dans d'autres fichiers TypeScript?

fichier 1:

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

fichier 2:

//what goes here?

class bar extends moo.foo
{
}

À partir de la version 1.8 de TypeScript, vous pouvez utiliser des importinstructions simples comme dans ES6:

import { ZipCodeValidator } from "./ZipCodeValidator";

let myValidator = new ZipCodeValidator();

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

Ancienne réponse: à partir de la version 1.5 de TypeScript, vous pouvez utiliser tsconfig.json: http://www.typescriptlang.org/docs/handbook/tsconfig-json.html

Cela élimine complètement le besoin de référencer le style de commentaire.

Réponse plus ancienne:

Vous devez référencer le fichier en haut du fichier actuel.

Vous pouvez faire ceci comme ceci:

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

class Foo { }

etc.

Ces chemins sont relatifs au fichier courant.

Votre exemple:

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

class bar extends moo.foo
{
}

Typescript distingue deux types de modules différents: Les modules internes sont utilisés pour structurer votre code en interne. Au moment de la compilation, vous devez amener les modules internes dans la portée en utilisant des chemins de référence:

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

class bar extends moo.foo {
}

D'autre part, les modules externes sont utilisés pour référencer les fichiers sources externes qui doivent être chargés au moment de l'exécution à l' aide de CommonJS ou AMD . Dans votre cas, pour utiliser le chargement de module externe, vous devez procéder comme suit:

moo.ts

export class foo {
    test: number;
} 

app.ts

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

Notez la manière différente d'intégrer le code dans la portée. Avec les modules externes, vous devez utiliser moduleavec le nom du fichier source qui contient la définition du module. Si vous souhaitez utiliser des modules AMD, vous devez appeler le compilateur comme suit:

tsc --module amd app.ts

Ceci est ensuite compilé en

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);
})    

Si vous utilisez des modules AMD, les autres réponses ne fonctionneront pas dans TypeScript 1.0 (le plus récent au moment de la rédaction).

Vous disposez de différentes approches, en fonction du nombre d'éléments que vous souhaitez exporter à partir de chaque .tsfichier.

Exportations multiples

Foo.ts

export class Foo {}
export interface IFoo {}

Bar.ts

import fooModule = require("Foo");

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

Exportation unique

Foo.ts

class Foo
{}

export = Foo;

Bar.ts

import Foo = require("Foo");

var foo = new Foo();

Si vous cherchez à utiliser des modules et que vous souhaitez les compiler dans un seul fichier JavaScript, vous pouvez effectuer les opérations suivantes:

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()
        {
        }
    }
}

Vous pouvez en savoir plus ici: http://www.codebelt.com/typescript/javascript-namespacing-with-typescript-internal-modules/

J'éviterais maintenant d'utiliser /// <reference path='moo.ts'/>mais pour les bibliothèques externes où le fichier de définition n'est pas inclus dans le package.

Le reference pathrésout les erreurs dans l'éditeur, mais cela ne signifie pas vraiment que le fichier doit être importé. Par conséquent, si vous utilisez un workflow gulp ou JSPM, ceux-ci peuvent essayer de compiler séparément chaque fichier au lieu d' tsc -outun fichier.

À partir de Typescript 1.5

Préfixez simplement ce que vous souhaitez exporter au niveau du fichier (portée racine)

aLib.ts

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

Vous pouvez également ajouter plus tard à la fin du fichier ce que vous souhaitez exporter

{
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
}

Ou même mélanger les deux ensemble

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

Pour l'importation vous avez 2 options, vous choisissez d'abord ce que vous voulez (une par une)

anotherFile.ts

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

Ou l'ensemble des exportations

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

Remarque concernant les exportations: exporter deux fois la même valeur provoquera une erreur {export valueZero = 0; export {valueZero}; // valueZero est déjà exporté…}

Depuis TypeScript, 1.8+vous pouvez utiliser des importinstructions simples et simples comme:

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

ou la version générique:

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

En savoir plus: https://www.typescriptlang.org/docs/handbook/modules.html

utilisé une référence comme "///<reference path="web.ts" /> et puis dans les propriétés du projet VS2013 pour la construction de "app.ts", "Typescript Build" -> "Combine javascript output into file:" (coché) -> "app.js"

import {className} from 'filePath';

souvenez-vous aussi. La classe que vous importez, qui doit être exportée dans le fichier .ts.

Processus simple et rapide dans Visual Studio

Faites glisser et déposez le fichier avec l'extension .ts de la fenêtre de la solution à l'éditeur, il générera un code de référence en ligne comme ..

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