JQuery Облегчение и WebPack - PullRequest
       1

JQuery Облегчение и WebPack

1 голос
/ 03 февраля 2020

У меня есть кнопка, которая должна скрыть набор фреймов и показать следующий

Это часть моего HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
<script src="./js/scripts-bundled.js"></script>

Это где функция замедления называется

import $ from "jquery";

class FormController {
  // variables declararations and some code not useful now...

  buttonClicked(evt) {

    this.current_object.animate(
      { opacity: 0 },
      {
        step: function(now, mx) {
        //as the opacity of current_fs reduces to 0 - stored in "now"
        //1. scale current_fs down to 80%
        scale = 1 - (1 - now) * 0.2;
        //2. bring next_fs from the right(50%)
        left = now * 50 + "%";
        //3. increase opacity of next_fs to 1 as it moves in
        opacity = 1 - now;
        this.current_object.css({
          transform: "scale(" + scale + ")",
          position: "absolute"
        });
        this.next_object.css({ left: left, opacity: opacity });
      },
      duration: 800,
      complete: function() {
        this.current_object.hide();
        this.animating = false;
      },
      //this comes from the custom easing plugin
      easing: "easeInOutBack"
    }
  );
}

Если я запускаю этот код и нажимаю на кнопку, я получаю эту ошибку Uncaught TypeError: jQuery .easing [this.easing] не является функцией

Я считаю, что по какой-то причине плагин замедления не загружен должным образом.

Есть ли способ потребовать его внутри кода через Webpack?

Спасибо

1 Ответ

0 голосов
/ 17 февраля 2020

У меня была такая же ошибка с jquery .easing, а затем исправлена ​​через Webpack следующим образом:

Добавьте эти зависимости в package.json

"dependencies": {
    "jquery": "3.4.1",
    "jquery.easing": "^1.4.1",
    "popper.js": "^1.16"
}

npm run install для установки зависимости и импортируйте его в файл main.js:

try {
    window.Popper = require('popper.js').default;
    window.jQuery = window.$ = require('jquery');
    require('jquery.easing'); // dat works :3
} catch (e) {}

Затем запустите скрипт webpack (например, npm run dev), чтобы создать сборку для приложения. Это прекрасно работает для меня.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...