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.
Use import myFunction from "./myModule" to bring it in. More commonly, TypeScript modules say export myFunction in which case myFunction will be one of the properties on the exported object. Use import { myFunction } from "./myModule" to bring it in.
To import all modules from a directory in TypeScript, we can create a module that reexports all modules that were imported. export { default as A } from "./a"; export { default as B } from "./b"; to import the default exports from modules a and b .
The scope defines that we are able to access the variable or not. TypeScript variables can be of the following scopes: Local Scope:As the name specified, are declared within the block like methods, loops etc. Local variables are accessible only within the construct where they are declared.
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");
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With