jQuery UI, ES6/ES7 sözdizimini kullanarak nasıl içe aktarılır?

Question

reactJS/Redux uygulamasında bazı jQuery UI işlevlerini kullanmaya çalışıyorum. Ben kullanarak hem jQuery ve jQuery UI ithal ettik:

npm install jquery jquery-ui 

Sonra denedim:

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

ben böyle bir şey yapmak çalıştığınızda Ancak jQuery UI ithal edilecek görünmüyor:

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

Sorunun jQuery UI ile olduğuna inanıyorum. Neyi yanlış yapıyorum? JQuery UI'yi bu yığınla çalışmak için nasıl alabilirim?

Teşekkür ederiz!

Answer 1

bileşen adı jQueryUI (hayır tire), import jqueryui from 'jquery-ui' veya basitçe import 'jquery-ui'

Answer 2

başarıyla jQueryUI kısmi ithalat kullanıyorum kullanmaktır.

Answer 3

bir takma adı ekleyin

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'; 

(Ama farklı olabilir diğer çevre yaklaşımında, ben WebPack https://webpack.github.io/ kullanıyorum hesapta almak): Ben jquery-ui den gerekli yalnızca ne zaman modülüne içe demek webpack yapılandırma: package.json kendilerine kaydet

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

:

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

Sonra

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

Geçen jquery (3.2.1) ve jquery-ui (1.12.1) ile benim için çalışıyor.

ayrıntı için blogumu bakınız: Ben ilk http://code.tonytuan.org/2017/03/webpack-import-jquery-ui-in-es6-syntax.html

Answer 4

,

buna ihtiyacım

npm install jquery-ui-bundle --save 

, sana göre ne anlama geliyor başlayanlar için

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