Reference External Modules in TypeScript

Question

I have an application which I want to convert step by step to TypeScript. Currently we are using browserify to generate a bundle.

When converting to TypeScript I am having some modules which have not yet been converted. In the TypeScript Handbook it says that I can reference external modules, when specifying a type definition file for it.

I have a module A.js which is not yet converted to TypeScript. I have a global type definition file which defines

declare module "A" {
    export function foo();
    export function bar();
}

I am importing my module like this:

///<reference path="../../typings/NotYetConvertedModules.d.ts" />
import A = require('../someFolder/A');

when compiling this I get

error TS2307: Cannot find external module '../someFolder/A'

When requiring it with require('A') the compilation step works but the module loader cannot find the file, since I am not having a global alias for it.

Is there any way to solve this?

Fenton · Accepted Answer · 2015-01-26 19:25:01Z

When you declare a module name in quotes, the quoted name becomes the alias. So when you write...

declare module 'A' { //...

You import it using the following (no matter where you are importing it):

import a = require('A');

This is useful when creating definitions for node.js modules, for example.

You cannot use a string alias with a relative path, so you can't have:

declare module '../SomeFolder/A' { //...

But you can place a definition file named a.d.ts in the appropriate location (SomeFolder).

The file ./SomeFolder/a.d.ts looks like this:

declare module A {
    export function foo();
    export function bar();
}

export = A;

The file ./Scripts/AnotherFolder/example.ts looks like this:

import A = require('../../SomeFolder/A');

You will need to adjust the path based on your exact folder structure, but you can see the idea. Importantly, you don't need the reference comment when importing the module from the same folder as the definition file.

Benjamin · Accepted Answer · 2015-01-26 17:59:18Z

1

Assuming you are using external modules (which means that the module ID depends on the file name)

Instead of writing in ../../typings/NotYetConvertedModules.d.ts

declare module "A" {
    export function foo();
    export function bar();
}

you should rather simply write in ../someFolder/A.d.ts

export function foo();
export function bar();

answered Jan 26, 2015 at 17:59

Benjamin

1,1737 silver badges19 bronze badges

Comments

Nathan Bellowe · Accepted Answer · 2015-01-27 21:35:15Z

0

I try to shy away from relative paths when using typescript for references. Maybe it is just me, but I find it buggy (for referencing).

In your require.js configuration, you can map the request string to a predefined list of files, or some similar system. For example require("document.text") could see "document" and map that to src/net/unicorns/document/text.js

This allows you to debug issues quickly too (typescript compiler errors are annoying).

Hope this helps.

answered Jan 27, 2015 at 21:35

Nathan Bellowe

4,9723 gold badges18 silver badges16 bronze badges

Collectives™ on Stack Overflow

Reference External Modules in TypeScript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related