jspm / jQuery / TypeScript - module "jquery" has no default export

Question

I'm trying to bootstrap a web app using TypeScript and jspm & system.js for module loading. I'm not getting very far. After installing jspm, and using it to install jQuery:

jspm install jquery

And the basics:

<script src="jspm_packages/system.js"></script>
<script src="config.js"></script>
<script>
        System.import('main');
</script>

main.ts:

import $ from "jquery";

export class Application  {
    constructor() {
        console.log($);
    }
}

The TypeScript won't compile because "Module 'jquery' has no default export.

The generated config.js has the correct mapping: "jquery": "npm:jquery@2.2.0"

Thanks that works! If you submit that as an answer I can accept it. — user888734, Feb 05 '16 at 12:49

score 71 · Accepted Answer · answered Feb 05 '16 at 12:57

71

When the module doesn't have a default export, you can import the complete module as object: import * as $ from "jquery";

or import named exports: import { ajax, css } from "jquery";

answered Feb 05 '16 at 12:57

Bob Sponge

4,708
1
23
25

1

Named exports doesn't work. Module jquery has no exported member 'css'. – mradzinski Jul 14 '16 at 21:16
Do not forget run: npm install jquery. – Skyware Aug 30 '17 at 13:09
If the exported module is in CommonJS /AMD/UMD format (single exported member) the TypeScript documentation states you should use `import $ = require("jquery");` https://www.typescriptlang.org/docs/handbook/modules.html#export--and-import--require Is there an advantage to either method? – Andrew May 11 '18 at 08:05

score -1 · Answer 2 · answered Jun 08 '18 at 14:05

-1

If you are using visual studio, update the typescript plugin.

To obtain the latest version for visual studio 2017, go there

answered Jun 08 '18 at 14:05

Daniel

9,312
3
48
48

jspm / jQuery / TypeScript - module "jquery" has no default export

2 Answers2

Linked