веб-пакет на бис и jquery ui (dateRangeSlider)

У меня проблемы с интеграцией плагина jquery-ui с моим приложением Symfony с помощью Webpack Encore. Вы можете увидеть ошибку (TypeError: t (...). DateRangeSlider не является функцией [Подробнее]) в консоли:

https://date-range-demo.herokuapp.com/en/blog/search

введите здесь описание изображения

Исходный код для этого находится на https://github.com/tacman/range-slider-demo, это просто демонстрация symfony с ползунком диапазона дат на странице поиска, через следующие изменения:

добавить библиотеки в package.json из командной строки

пряжа добавить jquery-ui jqrangeslider

добавить в /blog/search.html

    <div id="slider">Slider Placeholder</div>

добавлен в assets / js / search.js

import 'jquery-ui'; 
import 'jqrangeslider';

$('#slider').dateRangeSlider();

Активы создаются с помощью yarn run encore dev, я уверен, что это простая ошибка конфигурации, но я не могу понять, что это такое.

Развертывание в heroku добавило еще несколько вещей, но не связано с тем, что плагин не загружается. Чтобы увидеть эту ошибку локально, просто клонируйте репо, запустите composer install && yarn install && yarn run encore dev, затем запустите сервер и перейдите в / en / blog / search.

Спасибо за любую помощь в этом вопросе!


jquery webpack-encore symfony4 rangeslider jquery-ui
person Tac Tacelosky    schedule 21.01.2019    source источник

Ответы (3)


arrow_upward
3
arrow_downward

После нескольких часов поиска решения я сделал это, импортировав определенные файлы: Сначала я установил jquery-ui

npm i jquery-ui --dev

Затем в свой файл js я импортировал следующие файлы (перетаскивание):

require('jquery-ui/ui/widgets/droppable');
require('jquery-ui/ui/widgets/sortable');
require('jquery-ui/ui/widgets/selectable');
import $ from 'jquery';
person Houssem    schedule 02.03.2020

arrow_upward
2
arrow_downward

У меня была проблема с семой, но с перетаскиваемым компонентом jqueryui.

В своем приложении я использую require, а не import, но мне пришлось специально требовать перетаскиваемый компонент, а не весь jquery-ui.

У меня сейчас нет подходящего примера для копирования и вставки, но попробуйте импортировать файл draggable.js.

person Etshy    schedule 28.01.2019

arrow_upward
-1
arrow_downward

Вместо использования jquery-ui используйте webpack-jquery-ui: yarn add webpack-jquery-ui (в конечном итоге с опцией --dev).

А затем импортируйте его с require('webpack-jquery-ui') в свой search.js.

Это единственное решение, которое я нашел, но я не могу объяснить, почему без него не работает.

person Julien Busset    schedule 29.05.2019