Как включить html5sortable в свой проект?

Я не уверен, как включить html5sortable в свой проект. Я установил его с помощью npm:

npm install html5sortable --save

После того, как webpack упаковал вещи, я импортирую его следующим образом:

require 'html5sortable'

Но когда я вызываю (как говорят документы):

sortable('.sortable');

Я получил:

sortable is not a function или sortable is not defined

Я также пробовал следующие варианты (Livescript):

html5sortable = require 'html5sortable'
sortable = require 'html5sortable'
{sortable} = require 'html5sortable'

Как сказано в документации, «загрузить нужный вам файл из каталога dist /, например dist / html.sortable.min.js». Я использую webpack и не знаю, как это сделать, но я пробовал (в webpack.config (в livescript, но он должен быть достаточно читабельным)):

resolve:
    modules:
        'node_modules'
    alias:
        'html5sortable': 'html5sortable/dist/html5sortable.min.js'

Не работает.

я думаю, ты сделал это? - загрузить нужный вам файл из каталога dist /, например dist / html.sortable.min.js для уменьшенной версии iife.

Mauricio Gracia Gutierrez 10.04.2018 18:30

Я не уверен, что на самом деле означает «загрузить файл из dist /», почему это необходимо и как это сделать. Как я уже сказал, я использую webpack.

Berco Beute 10.04.2018 22:52

это означает, что вы упаковали сортируемый файл с помощью webpack, а затем включили сгенерированный пакет с помощью <script src = "dist/bundle.js"></script>

Mauricio Gracia Gutierrez 10.04.2018 23:07

Не уверен, что вы имеете в виду (извините, новичок в этом), но в webpack.config я попробовал (безрезультатно): resolve: modules: 'app / scripts' 'node_modules' псевдоним: 'html5sortable': 'html5sortable / dist / html5sortable .min.js '

Berco Beute 10.04.2018 23:51

включите ваш webpack.config в вопрос с правильным форматированием, я никогда не использовал его, поэтому он еще более «новичок для меня» ;-)

Mauricio Gracia Gutierrez 10.04.2018 23:59
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
4
5
445
1

Ответы 1

Оказывается, webpack может обрабатывать только файлы javascript, которые экспортируют модуль. В случае html5sortable это пакет CommonJS. Вот что мне пришлось включить в webpack.config:

resolve:
    modules:
        'node_modules'
    alias:
        'html5sortable': 'html5sortable/dist/html5sortable.cjs'

После этого я мог просто «потребовать» библиотеку и использовать ее:

sortable = require 'html5sortable'

sortable '.sortable'

Другие вопросы по теме