typescript compiler ignoring define/import in 1 file

Question

I'm suddenly having a very weird compile of one of my files.

comm.ts:

import document = require('./document/document');
import element = require('./document/elements/element');
import paragraph = require('./document/elements/paragraph');
import listBody = require('./document/list-body');
// ...

comm.js:

var __extends = this.__extends || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    __.prototype = b.prototype;
    d.prototype = new __();
};
define(["require", "exports"], function(require, exports) {
// ...

What's with the extends and more important, why does the define not pull in the 4 imports? They are used in the code.

And the big problem is that now when I run I get the error:

SCRIPT5007: Unable to get property 'prototype' of undefined or null reference comm.js, line 18 character 5

which is in the code listed above.

Answer 1

What's with the extends

TypeScript generates it to assist with inheritance. ie. class A extends B will result in the extends function being added.

why does the define not pull in the 4 imports? They are used in the code.

I don't believe they are used in the code. Ensure you have something like:

import listBody = require('./document/list-body');
var foo = listBody; // this will ensure code gen.

Your error `Unable to get property 'prototype' of undefined or null reference comm.js is reflecting to this fact. You are trying to extend something that isn't loaded (is missing in the generated define) because TypeScript thinks it isn't needed at runtime.

Local test I have verified that the code generated by TypeScript is correct if it notices an extend.

foo.ts:

class Foo{}
export = Foo;

bar.ts:

import Foo = require('./foo');
class Bar extends Foo{}

compile: tsc --module amd bar.ts

Generated bar.js:

var __extends = this.__extends || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    __.prototype = b.prototype;
    d.prototype = new __();
};
define(["require", "exports", './foo'], function(require, exports, Foo) {
    var Bar = (function (_super) {
        __extends(Bar, _super);
        function Bar() {
            _super.apply(this, arguments);
        }
        return Bar;
    })(Foo);
});

Answer 2

In my case, it was because I had a class Call extending a class Task, and the files for both classes were in the same folder. Which by itself isn't a problem, but Typescript/gulp compiles files within the same folder in order of file creation (modification?). So public class Call extends Task in file Call.ts was getting compiled before class Task in file Task.ts, and so Task wasn't defined at the time it was needed. Hence the error "Unable to get property 'prototype' of undefined or null reference".

Slightly maddening was the fact that both of those classes have a parent class elsewhere, which has a grandparent class, and the runtime error was thrown on the grandparent. The grandparent's from another folder, in another module, and is used successfully in many, many places across the app.