SystemJS: loading jQuery

Question

I'm using Angular2, and I'd like to include jQuery.

systemjs.config.js

(function (global) {
 System.config({
 paths: {
  'npm:': 'node_modules/',
  'jquery': "//code.jquery.com/jquery-2.1.4.min.js"
 },
 meta: {
    bootstrap: {
        deps: ['jquery']
    }
 },
.....
}

In app.module.ts, I got the error : Cannot find the module 'jquery' when I put :

import $ from 'jquery';

I try it using map instead of paths, but the same result..

TypeScript looks for packages into node_modules directory by default. Did you install jQuery with npm? — martin
– martin, Commented Oct 25, 2016 at 9:22
I already have jquery in /dev/assets/js folder not in node_modules — Mourad Idrissi
– Mourad Idrissi, Commented Oct 25, 2016 at 9:24
That's why it doesn't work, TypeScript can find jquery and throws an error. With jquery it's actually more complicated and you need to install also its typings. If you're using TypeScript 2.0 you can use npmjs.com/package/@types/jquery — martin
– martin, Commented Oct 25, 2016 at 9:38
I've downloaded it, the package.json was updated but the same problem (nothing's changed) :/ — Mourad Idrissi
– Mourad Idrissi, Commented Oct 25, 2016 at 11:24

halfer · Accepted Answer · 2024-02-21 23:13:38Z

2

The correct code is:

import * as $ from 'jQuery';

Also should you be mapping to a CDN?

Why not get jQuery via NodeJS or save jQuery locally and map to it?

edited Feb 21, 2024 at 23:13

halfer

20.2k20 gold badges111 silver badges208 bronze badges

answered Oct 25, 2016 at 10:42

danday74

58.1k56 gold badges273 silver badges337 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Mourad Idrissi Over a year ago

because I bought a template, and I have a lot of jQuery plugins... (I used the jQuery link just to make sure of path)

Aluan Haddad Over a year ago

Actually, for SystemJS, and for compliance with ECMAScript, the correct code is import $ from 'jquery'; Callable module namespace objects are not supported by the spec and are largely a CommonJS interop hack provided by TypeScript.

Collectives™ on Stack Overflow

SystemJS: loading jQuery

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related