How to import jQuery UI using ES6 ES7 syntax

0 votes

I am trying to use some jQuery UI functionality in my reactJS/Redux application. I've imported both jQuery and jQuery UI using:

npm install jquery jquery-ui

And then I've tried:

import $ from 'jquery';
import jQuery from 'query';
import jQuery-ui from 'jquery-ui';

However jQuery UI does not seem to be imported when I try to do something like:

componentDidMount() {
  $('ol#myList').selectable();
}

I believe the issue is with jQuery UI. What am I doing wrong? How can I get jQuery UI to work with this stack?

Apr 28, 2020 in JQuery by kartik
• 37,520 points
8,004 views

1 answer to this question.

0 votes

Hii,

Add a alias in webpack config:

resolve: {
  alias: {
    'jquery-ui': 'jquery-ui-dist/jquery-ui.js'
  }
}

Save them in package.json:

npm i --save jquery
npm i --save jquery-ui-dist

Then

import $ from 'jquery';
import 'jquery-ui';
answered Apr 28, 2020 by Niroj
• 82,840 points

Related Questions In JQuery

0 votes
1 answer

How to prevent multiple selection in jQuery UI Selectable plugin?

Hii @kartik, What I did is that I allow multiple ...READ MORE

answered May 30, 2020 in JQuery by Niroj
• 82,840 points
1,262 views
0 votes
1 answer

How to Get Currently Selected Tab Index In jQuery UI Tabs?

Hello @kartik, If you need to get the ...READ MORE

answered Sep 10, 2020 in JQuery by Niroj
• 82,840 points
18,748 views
0 votes
1 answer

How to scroll to element from bottom to top with a nice animation using Jquery?

Hello @kartik, Assuming you have a button with ...READ MORE

answered Sep 10, 2020 in JQuery by Niroj
• 82,840 points
4,274 views
0 votes
1 answer

How to disable HTML links using jquery?

Hello @kartik, Got the fix in css. td.disabledAnchor a{ ...READ MORE

answered Nov 26, 2020 in JQuery by Niroj
• 82,840 points
2,456 views
0 votes
1 answer

What is Laravel framework? Why one should use Laravel?

Laravel is a PHP web-framework; it utilized ...READ MORE

answered Mar 17, 2020 in Laravel by Niroj
• 82,840 points
1,696 views
0 votes
1 answer

How to download and install Lavavel framework?

Hey @kartik, First you must have xampp install ...READ MORE

answered Mar 17, 2020 in Laravel by Niroj
• 82,840 points
1,482 views
0 votes
1 answer

How can we get started with Laravel through Xampp?

Hii, First you need to start Apache and ...READ MORE

answered Mar 17, 2020 in Laravel by Niroj
• 82,840 points
1,038 views
0 votes
1 answer

What are the important directories used in a common Laravel application

Hey @Kartik. Directories used in a common Laravel ...READ MORE

answered Mar 17, 2020 in Laravel by Niroj
• 82,840 points
2,453 views
0 votes
1 answer

How to remove close button on the jQuery UI dialog?

Hii, I found this worked for me in the end ...READ MORE

answered May 12, 2020 in JQuery by Niroj
• 82,840 points
4,649 views
0 votes
1 answer

How to refresh a jQuery UI Slider after setting min or max values?

Hello @kartik, You should try doing something like ...READ MORE

answered May 30, 2020 in JQuery by Niroj
• 82,840 points
5,591 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP