Question

In an attempt to put together an AMD-friendly TypeScript application skeleton, I’ve run into a snag: I can’t seem to drop down from my current path to import a module in another directory. I can import modules that are above, but below throws an error:

TypeScript Error: The name ''../core/View'' does not exist in the current scope

Here the is the structure of my (very basic) app:

app/
 - core/
    - View.ts
 - views/
    - HomeView.ts
 - Application.ts

In my Application.ts file, I can successfully import a module like so:

import HomeView = module( 'views/HomeView' );

export class Application {
    constructor() {
        console.log( 'initializing Application' );
    }
}

Which, when using the –module AMD flag, correctly outputs

define(["require", "exports", 'views/HomeView'], function(require, exports, __HomeView__) {
    var HomeView = __HomeView__;

    var Application = (function () {
        function Application() {
            console.log('initializing Application', HomeView);
        }
        return Application;
    })();
    exports.Application = Application;    
})

Now, the problem is when I jump into views/HomeView.js and attempt to import my core/View BaseClass to extend from:

import View = module('../core/View');

export class HomeView {
    constructor() {
        console.log('Hello HomeView!');
    }
}

Which throws this complete error:

TypeScript Error: The name ''../core/View'' does not exist in the current scope
File: test/src/app/views/HomeView.ts
Start: 21, Length: 14

Line: import View = module('../core/View');
---------------------------^^^^^^^^^^^^^^--

Is this a bug in the compiler, or is my understanding of module imports faulty? Why would i be able to import views/HomeView, but not ../core/View?

Any help would be greatly appreciated.

Answer 1

I managed to get this to work using a root path – although I can’t tell you why your relative path doesn’t work.

import view = module("./app/core/View");