Laravel Elixir с JQuery и пользовательским интерфейсом JQuery

Я не могу получить требуемый пользовательский интерфейс JQuery при использовании Laravel Elixir с Webpack.

Вот мой gulpfile.js, ничего необычного:

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

elixir.config.sourcemaps = false;

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

В моем файле app.js я пытаюсь использовать как JQuery, так и JQuery UI. Я пробовал несколько вещей, но это то, где я нахожусь:

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

Независимо от того, что я делаю, я не могу заставить JQuery UI работать и работать.


webpack jquery laravel jquery-ui laravel-elixir
person Jean-Luc Tallis    schedule 04.11.2016    source источник

Ответы (3)


arrow_upward
7
arrow_downward

Догадаться. jquery-ui, как он создан и в npm не содержит dist-файла. Чтобы решить эту проблему, вы должны использовать файл с именем jquery-ui-bundle. Выполните следующую команду npm i -S jquery-ui-bundle.

Затем требуйте его после jquery

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

Надеюсь, это сэкономит кому-то время, я потратил несколько часов на то, чтобы понять это!

person Jake Sylvestre    schedule 10.12.2016
comment
@JagadeshaNH, ты тоже используешь эликсир для этого? - person Jake Sylvestre; 30.01.2017
comment
где вы ставите требование ?? - person Rabb-bit; 28.04.2017
comment
@Rabb-bit для импорта модулей - person Jake Sylvestre; 25.10.2017
comment
Спасибо @JakeSylvestre. Это сэкономило мне много времени!! - person foob.ar; 18.01.2019

arrow_upward
3
arrow_downward

npm install jquery-ui-bundle --save

В вашем bootstrap.js добавьте это:

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

npm run dev

person STWilson    schedule 24.06.2017

arrow_upward
1
arrow_downward

Три простых шага:

  1. Установите пакет npm: npm i -S jquery-ui-bundle

  2. Импортировать javascript (где-то после импорта jquery): require('jquery-ui-bundle');

  3. Импорт стилей css: node_modules/jquery-ui-bundle/jquery-ui.css
person jkgh    schedule 13.05.2017