Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Utilise jQuery plugin with ES6 import

Tags:

I've installed the jquery plugin summernote using npm and it's within my node_modules directory.

I'm now trying to utilise the summernote function in much the same way as I was before when I was just loading the scripts within the html.

import { summernote } from 'summernote';

export default function () {
    const summernote = $('.editor');
    summernote.summernote();
}

I can't get past the above code throwing summernote.summernote is not a function

like image 398
Luke Vincent Avatar asked Apr 26 '17 17:04

Luke Vincent


People also ask

Can I use jQuery with ES6?

jQuery source is now authored using ES6 modules. It's possible to use them directly in the browser without any build process.

Where do I put jQuery plugins?

How to use Plugins. To make a plug-in's methods available to us, we include plug-in file very similar to jQuery library file in the <head> of the document. We must ensure that it appears after the main jQuery source file, and before our custom JavaScript code.

What are jQuery plugins?

A jQuery plugin is simply a new method that we use to extend jQuery's prototype object. By extending the prototype object you enable all jQuery objects to inherit any methods that you add. As established, whenever you call jQuery() you're creating a new jQuery object, with all of jQuery's methods inherited.


1 Answers

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';
like image 93
Estus Flask Avatar answered Sep 25 '22 10:09

Estus Flask