Hi,

I've been running through the docs and issues this afternoon and have not been able to find a good answer to my problem. Please forgive me if I've just missed something - I will issue a documentation PR for this if I'm just doing something wrong. I do see jQuery used in a few of the examples, but it's just not working for me.

I'm trying to get jQuery loaded as a dependency in a script and access it via $ using SystemJS 0.19.4. I'm using TypeScript 1.6 and ES6-style imports and loading the compiled JS in the browser (not trying to compile in the browser).

I'm able to get $ to come in to my script (all of the properties of it are there), but $ itself is not a function - it's just an object. So standard jQuery stuff like $('#myDif') doesn't work. However, jQuery is getting imported because I can access static functions that are attached to $ such as $.isArray().

What would cause properties of $ to come in, but not have $ be a function?

Here's the code. I've changed my program.js to basically be a failing unit test.

test.html

  <script src="/scripts/systemjs/system.js"></script>
  <script src="../system-config.js"></script>
  <script>
    System.import("program");
  </script>

system-config.js

System.config({
    paths: {
        'jquery': '/scripts/jquery/jquery.min.js'
    },
    meta: {
        '/scripts/jquery/jquery.min.js': {
            format: 'amd',  //note I have tried global and cjs and there is no difference except
                            // the mechanism by which jQuery gets loaded (script tag or xhr)
            exports: '$'
        }
    },
    defaultJSExtensions: true
});

program.ts

import * as $ from 'jquery';

var results = [
   'Can access $.isArray() : ' + !!($.isArray([]) && !$.isArray('test')),
   'Can access $.isFunction() : ' + !!($.isFunction(() => {return null;}) && !$.isFunction('test')),
   'Can access $() : ' + !!$.isFunction($)
];

console.log(results.join('\n'));

Which compiles to:
program.js

System.register(['jquery'], function(exports_1) {
    var $;
    var results;
    return {
        setters:[
            function ($_1) {
                $ = $_1;
            }],
        execute: function() {
            results = [
                'Can access $.isArray() : ' + !!($.isArray([]) && !$.isArray('test')),
                'Can access $.isFunction() : ' + !!($.isFunction(function () { return null; }) && !$.isFunction('test')),
                'Can access $() : ' + !!$.isFunction($)
            ];
            console.log(results.join('\n'));
        }
    }
});

The output on the console in Chrome and IE 11 is:

Can access $.isArray() : true
Can access $.isFunction() : true
Can access $() : false

How do I get Can access $() : to be true ?

Thank you so much.