Laravel Elixier mit JQuery und JQuery UI

Question

Ich kann JQuery UI nicht verwenden, wenn Sie Laravel Elixir mit Webpack verwenden.

Hier ist meine gulpfile.js, nichts Ungewöhnliches:

const elixir = require('laravel-elixir'); 

elixir.config.sourcemaps = false; 

elixir(mix => { 
    mix.sass('app.scss') 
     .webpack('app.js'); 
}); 

Meine app.js Datei ist, wo ich sowohl JQuery und JQuery UI zu verlangen bin versucht. Ich habe mehrere Dinge ausprobiert, aber das ist, wo ich bin an:

window.$ = window.jQuery = require('jquery'); 
window.$ = $.extend(require('jquery-ui')); 

Egal was ich tue, kann ich nicht JQuery UI scheinen zu bekommen erforderlich und arbeiten.

Answer 1

Ich habe es herausgefunden. jquery-ui, as ist gebaut und in npm enthält keine dist-Datei. Um dies zu beheben, müssen Sie eine Datei namens jquery-ui-bundle verwenden. Führen Sie den folgenden Befehl npm i -S jquery-ui-bundle.

Dann benötigen sie nach jquery

require('jquery'); 
require('jquery-ui-bundle'); 

Hope this spart jemand einige Zeit, ich ein paar Stunden damit verbracht, das herauszufinden!

Answer 2

Drei einfache Schritte:

1. Installieren npm Paket: npm i -S jquery-ui-bundle

2. Import Javascript (irgendwo nach jquery Import): require('jquery-ui-bundle');

3. Import CSS-Stile: node_modules/jquery-ui-bundle/jquery-ui.css

Answer 3

npm install jquery-ui-bundle --save

In Ihrem bootstrap.js hinzufügen:

window.$ = window.jQuery = require('jquery'); 
window.$ = $.extend(require('jquery-ui-bundle')); 

npm run dev