How to Import Jquery Using Es6 Syntax

How to import jquery using ES6 syntax?

index.js

import {$,jQuery} from 'jquery';
// export for others scripts to use
window.$ = $;
window.jQuery = jQuery;

First, as @nem suggested in comment, the import should be done from node_modules/:

Well, importing from dist/ doesn't make sense since that is your distribution folder with production ready app. Building your app should take what's inside node_modules/ and add it to the dist/ folder, jQuery included.

Next, the glob –* as– is wrong as I know what object I'm importing (e.g. jQuery and $), so a straigforward import statement will work.

Last you need to expose it to other scripts using the window.$ = $.

Then, I import as both $ and jQuery to cover all usages, browserify remove import duplication, so no overhead here! ^o^y

How to import jQuery from a file using es6

You should use:

import * as jQuery from './jquery/jquery-3.3.1.js'

Documentation about the import statement:
https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Instructions/import

Getting type error importing jQuery using ES6 syntax

Because import $ from 'jQuery' is short for import {default as $} from 'jQuery'. If you import {$, jQuery}, those are two names that are not exported. You can however use

import {
    default as $,
    default as jQuery
} from 'jQuery';

Can't import both `$` and `jQuery` in one line in ES6

import X from 'thing';

is short for

import {default as X} from 'thing';

which means if you want to import the default as both $ and jQuery, you need to do

import {default as $, default as jQuery} from 'jquery';

Note, jquery exports only $ and doing the above only aliases jquery as two different names. Also, be sure to checkout Webpack's ProvidePlugin feature.

Utilise jQuery plugin with ES6 import

This module doesn't export anything useful (like it should be expected from jQuery plugin package).

Imported summernote isn't used, and unused imported member makes an import a noop.

It should be

import 'summernote';

---

Related Topics