SystemJS: What am I missing in providing the default JS Extension

Question

No, I am not building an angular2 application. I am trying out SystemJS, Here is my script to load my modules

<script type="text/javascript">
    System.config({ baseURL: '/scripts/ts',
        map: { 'deck': 'deck'}, defaultJSExtensions: "js", defaultExtension: "js" });
    System.import('deck').then(function () {
            document.write("Loaded...");
        });
</script>

Here are the console messages I am getting.

system.src.js:sourcemap:80 Uncaught (in promise) Error: Unexpected identifier   Evaluating http://localhost:61968/scripts/ts/deck   Loading deck
    at eval (<anonymous>)
    at evaluate (system.src.js:sourcemap:2821)
    at system.src.js:sourcemap:3620
    at dynamicExecute (system.src.js:sourcemap:1144)
    at doEvaluate (system.src.js:sourcemap:1091)
    at ensureEvaluate (system.src.js:sourcemap:999)
    at system.src.js:sourcemap:617
    at <anonymous>

It looks like systemjs is not picking up the default extension. How can I fix this?

Answer 1

defaultJSExtensions ceased to be supported from version 0.20.0 onwards. You can see it in the release notes for 0.20.0-alpha1: "Removes support for defaultJSExtensions."

defaultExtension is a parameter for packages defined in the packages option so you have to define a package in order to use it.

Considering that your map is also not necessary, then you should use something like this:

{ 
  baseURL: '/scripts/ts',
  packages: {
    // Yep, this defines a package with an empty name. This will
    // encompass everything not encompassed by a more specific package
    // name.
    "": {
      defaultExtension: "js" 
    },
  },
}

Actually, this also would work:

{ 
  baseURL: '/scripts/ts',
  packages: {
    "": {},
  },
}

Here's the reason for it: there's no global default for adding extensions. However, if you define a package but you do not specify a defaultExtension for it, then the package automatically gets a default value for defaultExtension which is "js".