ES6/ES7 वाक्यविन्यास का उपयोग कर jQuery UI को आयात करने के लिए कैसे?

Question

मैं अपने प्रतिक्रिया जेएस/रेडक्स एप्लिकेशन में कुछ jQuery UI कार्यक्षमता का उपयोग करने की कोशिश कर रहा हूं। मैं का उपयोग कर दोनों jQuery और jQuery यूआई आयात किया है:

npm install jquery jquery-ui 

और फिर मैं कोशिश की है:

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

हालांकि jQuery यूआई जब मैं की तरह कुछ करने की कोशिश आयात करने के लिए प्रतीत नहीं होता:

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

मेरा मानना ​​है कि यह समस्या jQuery UI के साथ है। मैं क्या गलत कर रहा हूं? इस स्टैक के साथ काम करने के लिए मैं jQuery UI कैसे प्राप्त कर सकता हूं?

धन्यवाद!

Answer 1

घटक नाम jQueryUI (कोई हाइफ़न), import jqueryui from 'jquery-ui' या बस import 'jquery-ui'

Answer 2

मैं सफलतापूर्वक jQueryUI से आंशिक आयात उपयोग कर रहा हूँ का उपयोग करें।

import $ from 'jquery'; 
import 'jquery-ui/themes/base/core.css'; 
import 'jquery-ui/themes/base/theme.css'; 
import 'jquery-ui/themes/base/selectable.css'; 
import 'jquery-ui/ui/core'; 
import 'jquery-ui/ui/widgets/selectable'; 

(लेकिन खाते है कि मैं webpack https://webpack.github.io/ उपयोग कर रहा हूँ में ले भिन्न हो सकती है अन्य पर्यावरण दृष्टिकोण में,)

Answer 3

में एक अन्य नाम जोड़ें: मैं अपने मॉड्यूल मैं केवल क्या jQuery-ui से जरूरत के लिए आयात का मतलब webpack config:

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

उन्हें बचाना package.json में

:

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

फिर

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

पिछले jQuery (3.2.1) और jQuery-ui (1.12.1) के साथ मेरे लिए काम।

विस्तार के लिए मेरे ब्लॉग देखें: http://code.tonytuan.org/2017/03/webpack-import-jquery-ui-in-es6-syntax.html

Answer 4

मैं पहली बार,

npm install jquery-ui-bundle --save 

जब मैं इसकी आवश्यकता है, मैं

import 'jquery-ui-bundle'; 
import 'jquery-ui-bundle/jquery-ui.css'; 

शुरुआत, आप से क्या मतलब है के लिए