Search code examples
javascripttypescriptvisual-studio-2013systemjs

Unable to load module with extention js in TypeScript and Systemjs


Get request by Systemjs is not adding extention .js to the url.

These are my TypeScript Classes

customer.ts

import {Address} from "./Address";

export class Customer {
    private _customerName: string = "";
    public CustomerAddress: Address = new Address();
    public set CustomerName(value: string) {
        if (value.length == 0) {
            throw "Customer Name is required"; 
        }
        this._customerName = value;
    }
    public get CustomerName() {
        return this._customerName;
    }
    Validate(): boolean {
        return this._customerName != '';
    }
}

address.ts

export class Address {
    public Street1: string = "";
}

using following Systemjs init code

System.config({
      defaultExtension: 'js',
});
System.import("Customer.js").then(function (exports) {
      var cust = new exports.Customer();
});

Customer.js is loaded successfully but Address.js is not.

The GET request for Address.js does not contains .js extention resulting following request in console

GET http://localhost:65401/Address 404 (Not Found).

I have tried to update following code in customer.ts to following

import {Address} from "./Address.js";

But it is syntactically wrong and it shows error in VS2013.

How can i force Systemjs to add extension ".js" to the GET request.

Thanks


Solution

  • The defaultExtension keyword is not a top level config option. It needs to be under packages directive, see: https://github.com/systemjs/systemjs/blob/master/docs/config-api.md#packages

    That's why it's ignored and SystemJS doesn't append the extension. You can define one "global" package which is probably the easiest way to make sure the extension is always appended to every import path:

    SystemJS.config({
      packages: {
        '.': {
          defaultExtension: 'js'
        }
      }
    });