Saat menggunakan plugin TypeScript untuk vs.net, bagaimana cara membuat satu modul impor file TypeScript dideklarasikan di file TypeScript lainnya?

file 1:

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

file 2:

//what goes here?

class bar extends moo.foo
{
}

Dari TypeScript versi 1.8 Anda dapat menggunakan importpernyataan sederhana seperti di ES6:

import { ZipCodeValidator } from "./ZipCodeValidator";

let myValidator = new ZipCodeValidator();

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

Jawaban lama: Dari TypeScript versi 1.5 Anda dapat menggunakan tsconfig.json: http://www.typescriptlang.org/docs/handbook/tsconfig-json.html

Ini sepenuhnya menghilangkan kebutuhan referensi gaya komentar.

Jawaban yang lebih lama:

Anda perlu merujuk file di bagian atas file saat ini.

Anda dapat melakukan ini seperti ini:

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

class Foo { }

dll.

Jalur ini relatif terhadap file saat ini.

Contoh Anda:

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

class bar extends moo.foo
{
}

Script membedakan dua jenis modul: Modul internal digunakan untuk menyusun kode Anda secara internal. Pada waktu kompilasi, Anda harus membawa modul internal ke dalam lingkup menggunakan jalur referensi:

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

class bar extends moo.foo {
}

Di sisi lain, modul eksternal digunakan untuk mereferensikan file sumber eksternal yang akan dimuat saat runtime menggunakan CommonJS atau AMD . Dalam kasus Anda, untuk menggunakan pemuatan modul eksternal Anda harus melakukan hal berikut:

bulan

export class foo {
    test: number;
} 

app.ts

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

Perhatikan cara yang berbeda untuk memasukkan kode ke dalam cakupan. Dengan modul eksternal, Anda harus menggunakan moduledengan nama file sumber yang berisi definisi modul. Jika Anda ingin menggunakan modul AMD, Anda harus memanggil kompiler sebagai berikut:

tsc --module amd app.ts

Ini kemudian dikompilasi ke

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

Jika Anda menggunakan modul AMD, jawaban lain tidak akan berfungsi di TypeScript 1.0 (yang terbaru pada saat penulisan.)

Anda memiliki pendekatan berbeda yang tersedia untuk Anda, tergantung pada berapa banyak hal yang ingin Anda ekspor dari setiap .tsfile.

Beragam ekspor

Foo.ts

export class Foo {}
export interface IFoo {}

Bar.ts

import fooModule = require("Foo");

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

Ekspor tunggal

Foo.ts

class Foo
{}

export = Foo;

Bar.ts

import Foo = require("Foo");

var foo = new Foo();

Jika Anda ingin menggunakan modul dan ingin mengkompilasi ke file JavaScript tunggal Anda dapat melakukan hal berikut:

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

Anda dapat membaca lebih lanjut di sini: http://www.codebelt.com/typescript/javascript-namespacing-with-typescript-internal-modules/

Saya akan menghindari sekarang menggunakan /// <reference path='moo.ts'/>tetapi untuk perpustakaan eksternal di mana file definisi tidak termasuk ke dalam paket.

The reference pathmemecahkan kesalahan dalam editor, tetapi tidak benar-benar berarti kebutuhan file yang akan diimpor. Oleh karena itu jika Anda menggunakan alur kerja atau JSPM, mereka mungkin mencoba mengkompilasi secara terpisah setiap file alih-alih tsc -outke satu file.

Dari Typescript 1.5

Awali apa yang ingin Anda ekspor di tingkat file (cakupan root)

aLib.ts

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

Anda juga dapat menambahkan di akhir file apa yang ingin Anda ekspor

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

Atau bahkan mencampur keduanya

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

Untuk impor Anda memiliki 2 opsi, pertama Anda pilih lagi apa yang Anda inginkan (satu per satu)

anotherFile.ts

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

Atau seluruh ekspor

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

Catatan tentang ekspor: mengekspor dua kali nilai yang sama akan menimbulkan kesalahan {export valueZero = 0; ekspor {valueZero}; // valueZero sudah diekspor ...}

Sejak TypeScript 1.8+Anda dapat menggunakan importpernyataan sederhana sederhana seperti:

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

atau versi wildcard:

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

Baca lebih lanjut: https://www.typescriptlang.org/docs/handbook/modules.html

menggunakan referensi seperti "///<reference path="web.ts" /> dan kemudian di properti proyek VS2013 untuk membangun "app.ts", "Membangun ScriptScript" -> "Gabungkan output javascript ke file:" (dicentang) -> "app.js"

import {className} from 'filePath';

ingat juga. Kelas yang Anda impor, yang harus diekspor dalam file .ts.

Proses Cepat dan Mudah di Visual Studio

Seret dan Jatuhkan file dengan ekstensi .ts dari jendela solusi ke editor, ini akan menghasilkan kode referensi sebaris seperti ..

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