импорт noUiSlider ES6 - PullRequest
Новая
       14

импорт noUiSlider ES6

0 голосов
/ 18 апреля 2019

Я сообщаю здесь то, о чем я также сообщил здесь: https://github.com/leongersen/noUiSlider/issues/971.

Я установил noUiSlider с импортом ES6 (без веб-пакета), как предложено в официальном репозитории https://github.com/leongersen/noUiSlider#webpack.

Так вот, что у меня есть. 

// main.js
import 'nouislider';

//index.html

<html>

<body>

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

  <script src="js/bundle.js"></script>

  <script>
    var slider = document.getElementById('slider');

    noUiSlider.create(slider, {
      start: [20, 80],
      connect: true,
      range: {
        'min': 0,
        'max': 100
      }
    });
  </script>

</body>

</html>

Но это не работает, и в консоли появляется следующее сообщение 

Uncaught ReferenceError: noUiSlider is not defined.

Если я вставлю <script src="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/13.1.4/nouislider.min.js"></script> вместо <script src="js/bundle.js"></script>, это сработает.

Может ли кто-нибудь мне помочь? Благодаря.

1 Ответ

0 голосов
/ 19 апреля 2019

import 'nouislider' в main.js импортирует переменную noUiSlider в этот файл.

По умолчанию не экспортирует ее в ваш window объект.Когда вы включаете скрипт из CDN, он экспортирует в window, поэтому он там работает.

Вы можете:

  • Переместить вашкод инициализации ползунка в main.js
  • Добавить window.noUiSlider = noUiSlider в main.js
...